1.在项目下新建一个index.js
import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
var state = {
//要设置的全局访问的state对象
DoralerFormInfo: {}, //当前登录人的名字
active:0,
};
//全局使用 this.$store.getters.xx (xx为getters里的值) 可获取当前最新的存储值
var getters = {
//实时监听state值的变化
DoralerFormInfo() {
return state.DoralerFormInfo;
},
rues(){
return state.active
}
};
//全局使用 this.$store.commit(xx,传值) (xx为mutations里的值,传值) 可传值修改state对应的值
//mutations为同步方法 只可在同步的事件中使用
var mutations = {
set_DoralerFormInfo(state, obj) {
state.DoralerFormInfo = obj;
},
set_Do1(state, active) {
state.active = active;
},
};
// 全局使用 this.$store.dispatch(xx,传值) xx为actions里的值
//actions为异步方法
var actions = {
change_DoralerFormInfo(context, obj) {
context.commit("set_DoralerFormInfo", obj);
},
change_set_Do1(context, obj) {
context.commit("set_Do1", obj);
},
};
var store = new Vuex.Store({ state, getters, mutations, actions });
export default store;
2.在main.js中引用import store from "./store";(注:自己文件存在的绝对路径或相对路径)
在main.js中用实例调用Vue.prototype.$store = store;
3.在某个页面存值 this.$store.commit("set_Do1",要存的参数名),为同步
this.$store.dispatch(set_DoralerFormInfo,要存的参数名)为异步
4. 用this.$store.getters.rues取值