在现阶段的前端开发中，vue框架现在已经成为了前端开发的热门框架，在开发的过程中，我们难免会遇到项目里面多处组件同时调用一些公共的值的情况，这些值（状态）不仅包括从服务器获取的数据，还包括本地创建的数据，为了方便对数据（状态）进行管理，这个时候，我们可以选择使用vuex，废话不多说我们进入正题。
1.状态管理作用
状态管理可以对数据进行统一管理，所有的组件都可以调用，方便对单页面进行管理。
2.状态管理vuex里面的几个重要的角色
1.state，个人理解为顶层组件（公共的仓库、公共的数据源），不同的组件都可以从顶层的组件中进行取值。（这个地方暂时先将user看成是一个new Vuex.Store实例吧，我这个地方状态管理也模块化了）。图中state就相当于一个公共的仓库，里面有我们初始化定义的值（status，code等等）
2.getters，个人理解为过滤数据，可以认为是 store 的计算属性，getters去数据处理的话还是比较方便的，getter 接受 state 作为其第一个参数,getter 会暴露为 store.getters 对象,我们可以在组件里面使用this.$store.getters. + ‘属性’去访问。（这个地方就引入官方的例子了），组件里面通过this.store.getters.doneTodos就可以访问到啦。
2.mutations，我将它理解为状态管理里面的method，用来改变我们在state中初始化定义的state里面的数据，this.$store.commit('mutations方法名',传入的值)，同步操作。（用的更多的是dispath后面我们会讲到的）
我们可以通过在组件中使用，this.$store.commit（“SET_CODE”，传入的值），调用mutations里面的这个SET_CODE这个方法去改变state里面code的值。
3.actions，这个地方我将actions理解为一个动作，就好像交警指挥的手势一样，他挥手让你直行通过，他只是告诉你，要执行直行的命令，去做执行这件事的并不是交警（这样比喻方便理解吧），actions下发指令去执行mutations里面的函数，actions里面可以有任何异步的操作，
this.$store.dispatch('LoginByUsername',this.loginForm)；这个地方我们是通过dispath去触发actions里面LoginByUsername这个指令，{commit}这个可以理解为从new Vuex.Store里面解构出来，action 函数接受一个与 store 实例具有相同方法和属性对象，这里我们可以理解为store实例，但底层的逻辑并不是真正的store实例，我们这里可以先这么理解。this.loginForm这个是我们传入的值，将我们传入的值赋给store里面的state，我们store最终处理的函数还是commit('SET_TOKEN', data.token)，通过调用mutations里面的SET_TOKEN这个方法去更新state里面的值。
写的不对的地方或者不好的地方希望大家指正出来，遇到问题，我们可以一起讨论，不喜勿喷，谢谢！
