1.src下新建store文件夹，新建index.js
import Vuefrom 'vue'//引入vue
import Vuexfrom 'vuex' //引入vuex
Vue.use(Vuex);
const store =new Vuex.Store({
state:{
unreadMessage:0,//用户未读消息
},
//获取数据
getters: {
getUnreadMessage:function(state){
return state.unreadMessage;
}
},
//修改数据
mutations:{
//改变用户消息的数量
changeMessage(state,unreadMessage){
state.unreadMessage = unreadMessage;
},
},
//把在组件中的this.$store.commit("add");换成这个，
//使用、this.$store.dispatch();
actions:{//把在vue组件中处理的方法放在index的里面，
changeMessageFun(context,unreadMessage){//接收一个与store实例具有相同方法得属性context对象
context.commit("changeMessage",unreadMessage);
},
}
});
export default store;
2.main.js中
import storefrom './store/index'
Vue.prototype.$store = store;
3.组件中。
this.$store.getters.getUnreadMessage //获取数据
this.$store.dispatch("changeMessageFun",this.unreadMessage);//设置数据
