uniapp内置了vueX，不用自己安装，直接引入就好了。
nuiapp内置vueX文档说明
1、新建 store 文件夹，创建index.js文件
// store/index.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);//vue的插件机制
//Vuex.Store 构造器选项
const store = new Vuex.Store({
state: {
'phone': {
brand: null,
model: null,
},
'page': 0,
},
mutations: {
getPage(state, newValue) {
state.page = newValue;
},
getPhone(state, newValue) {
state.phone.brand = newValue.brand;
state.phone.model = newValue.model;
}
},
actions: {
setPage(context, value) {
context.commit('getPage', value);
},
setPhone(context, value) {
let phone = {
brand: value.brand,
model: value.model
}
context.commit('getPhone', phone);
},
},
modules: {}
})
export default store
// App.vue
<template>
<text class="text">{{phone.model}}</text>
</template>
<script>
export default {
onLaunch: function() {
const _this = this;
uni.getSystemInfo({
success: function (res) {
console.log(res.brand); // 品牌
console.log(res.model); // 型号
_this.$store.dispatch('setPhone', {brand: res.brand, model: res.model});
}
});
},
computed: {
...mapState(['phone']),
}
}
</script>
// index.vue
<template>
<text class="text">{{page}}</text>
</template>
<script>
import { mapState } from 'vuex'
export default {
data() {
return{}
},
computed:{
...mapState(['page']),
},
methods: {
Jump(ind) {
this.$store.dispatch('setPage', ind);
}
},
}
</script>
