一、目的：让代码更好维护，让多种数据分类更加明确
二、修改 store.js

const person = {namespaced: true; // 开启命名空间state: {},getters: {},actions: {},mutations: {}
}const count = {namespaced: true; // 开启命名空间state: {},getters: {},actions: {},mutations: {}
}const store = new Vuex.Store({mudules: {person,count}
})

三、开启命名空间后，组件中读取 state 数据

// 方式一：直接读取
this.$store.state.module1.xxx
// 方式二：借助 mapState 读取
...mapState('person', ['xxx', 'xxx', 'xxx']); // 指明哪个数据来自哪个模块

四、开启命名空间后，组件中读取 getters 数据

// 方式一：直接读取
this.$store.state.getters['person/xxx']
// 方式二：借助 mapGetters 读取
...mapGetters('person', ['xxx']);

五、开启命名空间后，组件中调用 dispatch

// 方式一：直接调用
this.$store.dispatch('person/xxx', data)
// 方式二：借助 mapActions 读取
...mapActions('person', {key: 'value'});

六、开启命名空间后，组件中调用 commit

// 方式一：直接调用
this.$store.commit('person/xxx', data)
// 方式二：借助 mapMutations 读取
...mapMutations('person', {key: 'value'});