vue vuex 模块化 namespace

总结：

 如果不用map写的话,就如下只有state数据形式结构是正常的

但是mutations和actions和getters写法都会不一样.因为它的内容包裹不一样了

 

 

如果不模块化的话,就像这边,求和和人员的方法都写在一起,到以后功能多了,就会有好多方法,会让这一个mutations非常臃肿,不好维护

 所以我们要把不同分类的mutation放在不同位置

state actions getters也也是一样

所以我们要把它们分类好

非常简单

然后创建store时

要配置modules属性

命名与变量相同可以简写

 

但如果这样写的话之前组件里写的也就拿不到了

 

 因为store进行模块化后,里面state不能直接读到sum school subject personList

 

 验证下,

发现state里面有a，a里面才有数据

 所以直接mapState的时a和b 然后再在模板上读a b里面的东西

也可以通过配置namespace来通mapState直接进行分类读取

这边namespace:true配置后,

你的countAbout这个分类名,才会被mapState识别

 

 第一个参数为分类名,第二个为你要分类中映射的数据

然后这边mapmutations也会出错，毕竟前面说过这样简写就会默认为commit('JIA',??)问号里面参数是模板中自己写进去的

 

解决与maspState同理,在前面加上一个参数，写入分类名就行

 

mapActions也是一样

mapGetters也是一样

 在人员组件中我们不用map映射的方式来写，用麻烦的写法

但是发现报错

 这是因为这边commit的时候没有说这个方法是在那个分类中，就像之前用map映射一样会有两个参数第一个是指定在哪个分类之中的,第二为在分类中数据方法的名字

但是如果像映射一样去通过加一个参数去指名分类是不对的

而正确的写法是去前面加入一个‘/’底层代码就会通过斜杠来区分出这是分类名

但写getters时发现同样写法,但是报错了 

 

 发现getters里面的结构和state不一样

 

既然.的方式行不通,那就用[]来读取

 

 而且dispatch也是一样

 而且还可以通过分文件.进行分别管理

然后再index.js中进行引用

 

 如果要通过发请求从得到的数据进行对数据的处理

那么就要在actions进行发送请求