vuex状态管理

Posted 2022-05-31 tis100204

State：

vuex中的数据源，我们需要保存的数据就保存在这里，可以在页面通过 this.$store.state来获取我们定义的数据；

Getters：

Getter相当于vue中的computed计算属性，getter 的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算，这里我们可以通过定义vuex的Getter来获取，Getters 可以用于监听、state中的值的变化，返回计算后的结果。

Mutations：

更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件：每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数。且是同步函数

Action：

Action 提交的是 mutation，而不是直接变更状态。可以包含任意异步操作。

Module：

每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块——从上至下进行同样方式的分割

辅助函数

mapState：

为了解决当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。此函数返回的是一个对象。

mapGetters： 

是将 store 中的 getter 映射到局部计算属性