vuex使用方法以及踩坑记录

1.在webpack中配置vuex方法

见博文：在webpack中vuex配置

2.在组件中的使用步骤：

（1）在项目的入口文件index.js中添加语句：

import Vuex from 'vuex'
import store from './store';
Vue.use(Vuex);

var sfopenpc = new Vue({
	el: '#app',
	router,
	store,
	render: h => h(App),
	
});

（2）在要使用到的组件中使用 ：this.$store.state.global.userName访问global模块中的变量userName

解释：

state是this.$store中的一个属性，里面即存储状态管理中定义的变量，global则为自己定义的一个模块。

如果你的没有定义模块，则可直接用this.$store.state.变量名。

注意：常量state只用于存储状态，不能在state里直接修改状态
如果要修改状态，需使用mutations，它是专门用于修改state常量中的属性状态的对象，在mutations对象中可以定义一系列方法用于修改statestate常量中保存的的状态。

3.踩坑记录

（1）无法读取到state属性

原因：在入口文件未引入
import Vuex from ‘vuex’
Vue.use(Vuex);