---

theme: channing-cyan

state

• state是一个单一状态树,vuex中唯一的数据来源,每个应用将仅仅包含一个store实例
• store.state.count可以用来获取store中state中的数据,但是这种获取方式过度的导致组件依赖全局状态单例,在模块化的构建系统中,在每个需要使用state的组件中需要大量呃引入,并且在测试组件时需要模拟状态
• vuex通过vue的插件系统将store实例从根组件中注入到所有的子组件里,且自组件能通过this.$store访问到state中的数据
• mapState()辅助函数能够获取state中的数据,当一个组件需要获取多个状态的时候,将这些状态都声明为计算属性会有些重复和冗余,为了解决这个问题我们可以使用mapState()辅助函数来帮助我们生成计算属性

getter是store中的state中派生出来的一些状态

mutation

• 更改vuex的store中你的状态的唯一方法是提交mutation,每一个mutation都有一个字符串的时间类型个一个回调函数,这个回调函数就是我们实际进行状态更改的地方,并且它会接收state作为第一个参数
• 不能直接调用一个mutation处理函数,需要用store.commit()方法去调用
• store.commit中可以传入额外的参数,即mutation的载荷payload
• mutation必须是同步函数,每一条mutation被记录在,devtools都需要捕捉到前一状态,和后一状态的快照,但是在mutation中的异步函数是捕捉不到的,因为当mutauion触发的时候,回调函数还没有被调用,devtools不知道什么时候回调函数实际上被调用---实质上任何回调函数中进行的状态的改变都是不可追踪的
• 在组件中使用this.$store.commit('xxx')提交mutation,或者使用mapMutation辅助函数将组件中的methons映射为store.commit调用

action

• action类似于mutaion
• action提交的是mutaion,而不是直接更改状态
• action可以包含任何异步操作
• action函数接受一个与store实例具有一样方法和属性的context对象,因此我们可以用context.commit提交一个mutation,或者通过context.state和context.getters来获取state和getters
• 组建中通过store.dispatch()来分发触发action
• mapActions也可以用来分发action
• store.dispatch()可以用来处理被触发的action的处理函数返回的promise,并且store.dispatch()仍旧返回promise

modules

• 默认情况下,模块内部的action和mutation任然是注册在全局命名空间的,这样使得多个模块对同一个action或mutation做出响应,getter也同样注册在全局命名空间,不要在不同的,无命名空间的模块中定义一样的getter从而导致错误
• 增加模块具有更高的封装度和复用性,可以添加namespaced:true的方式使其成为带命名空间的模块,当模块被注册之后,它的所有getter,action及mutation都会被自动根据模块注册路径调整命名