Vuex 辅助函数 和 模块化管理

Vuex 辅助函数

    利用mapState方法使用拓展运算符把State里的值解构在computed中，
    在this中也可以找到对应解构出来的方法
    ...mapState(['num']),
    如果mapState中的属性名和data中的同名了，可以采用对象的形式修改
    ...mapState({nub:'num'}), 
    会在methods中解构成类似的形式
          num:function(){...}
          
    mapMutations,mapActions,mapGetters一样操作
        

解构出来的方法可以直接使用

模块化管理

在store文件下创建一个modules文件里创建模块

    文件内容
            const state = {
                modastr:'我是模块A的数据'
            }
            const getters = {
            }
            const mutations = {    
            }
            const actions = {
            }
            export default{
                /* 保证模块之间的数据独立运行，不互相影响 */
                namespaced:true,
                state,
                getters,
                mutations,
                actions,
            }
    在store里的index.js文件里引入模块
            import modA from '@/store/modules/modA'
            import modB from '@/store/modules/modB'
    在modules里把模块注册
                modules: {
                    modA,
                    modB
                }
    console.log(this.$store)
    可以找到你注册的米宽modA.modB

就可以在网页中显示