Vuex状态管理思路

1、全局单例模式

2、官方图片

利用vuex修改组件视图的步骤是，调度一个行为（主要用于处理异步操作），并且把行为提交到变化集（mutations）中，然后mutate状态，然后渲染组件视图。那么为什么不直接修改状态呢？因为vue的devTool要实时的跟踪组件的状态管理，知道是哪个组件修改的状态，因此必须在变化集中修改状态，这样devtools才能跟踪到。

3、使用

• State State单一状态树进行统一管理
• getters 从store中获得一些state变异后的状态$store.getters.，并且getters里可以传入state,但是不能传入其他的参数，如果想利用参数只能返回一个带参数的函数
• mutations 可以接受参数和state，是vuex更新store的唯一方式，包括事件类型和回调函数，要想改变store里面的值就必须提交事件类型，在使用mutations中只需要给他传入参数，只会响应式的改变初始化在state中的属性，所以当需要删除或者增加state里面的元素时，使用Vue.set delete

// payload: 负载
        // 1.普通的提交封装
        // this.$store.commit('incrementCount', count)

        // 2.特殊的提交封装
        this.$store.commit({
          type: 'incrementCount',
          count
        })

• actions 主要用于处理异步操作，传入一个context（作用等同于它外层的store，具有相同的属性和方法），可以用来得到state，提交commit，在组件中调用actions里面的方法使用$store.dispath,和mutation一样可以传入参数
• modules 为了解决项目过大引起的状态属性过多的情况，因此将store分解成module，里面有自己的state，getters，mutations，在actions里面可以传入自己module的context但是里面包括了上文，也就是rootcontext