vuex学习day03-辅助函数mapActions、getters、模块module、分模块后的访问（均需要开启命名空间）

8、actions续

（3）辅助函数mapActions

        1）作用：提取actions中的方法，映射到组件的methods中

        2）语法

已知：                

①导入

②展开映射

③使用

效果：

9、getters

（1）作用：类似于计算属性

（2）语法

        1）在仓库中， getters提供方法（方法中必须有 返回值）

        2）访问

                ①通过store访问

②通过辅助函数mapGetters访问

导入

展开映射到computed计算属性中

使用：

效果（两种访问方式，效果相同）：

  

10、模块module

（1）作用：将state大对象切割成不同的小模块，便于维护。（由于vuex使用单一状态树，应用的所有状态（或者说数据）会集中成一个比较大的对象，当应用变得非常复杂时，不易维护）

（2）语法

已知：

1）在store下新建modules文件夹，里面提供划分的模块文件

2）在新建文件中，提供state，actions，mutations，getters，填入相应的信息，并导出

3）在仓库中，导入，并通过modules挂载

11、分模块后的访问（均需要开启命名空间）

（1）state

1）通过$ store.state.模块名.属性

2）mapState映射

第一种：

①导入：

②展开到计算属性

③使用

④效果：

第二种：

①在相应的模块开启命名空间

②导入：

③展开到计算属性

④使用

⑤效果：

（2）getters

已知：

1）通过$store.getters[‘模块名/方法名’]访问

        效果：

2）通过mapGetters映射

        ①导入

        ②在计算属性中展开

        ③使用

        ④效果

（3）mutations（会挂载到全局，开启命名空间，才会挂载到子模块）

        ·已知（在对应模块提供mutations方法）：

        

1）通过store.commit(‘模块名/方法名’，‘额外参数’)

        

效果：

                ​​​​​​​        ​​​​​​​        ​​​​​​​        

2）通过mapMutations

        ①导入

        

        ②在methods中展开，调用

        

        ③渲染

        

④效果

                ​​​​​​​                

（4）actions（会挂载到全局，开启命名空间，才会挂载到子模块）

（context默认提交的是自己模块的mutations和actions）

已知（actions中有一异步方法）：

        

        

1）通过store调用

效果：

2）通过mapActions映射

        ①导入

        ②展开映射

        ③调用

        ④效果