vuex之namespaced的使用详解

vuex中的store分模块管理，需要在store的index.js中引入各个模块，为了解决不同模块命名冲突的问题，将不同模块的namespaced:true，可以实现分离模板间的独立。

使用举例如下：

定义一个peopleInfo模块，定义了state,actions,mutatios等

import { getUserInfo } from "@/api/userController" const peopleInfo = {   namespaced: true, // 模块化分离   state: {    name: 'chen'   },   actions: {     GetUserInfo ({ commit }) {       return new Promise((resolve, reject) => {         getUserInfo().then((res) => {           const data = res.data           commit('changeNameFun', data.userName)           resolve(data)         }).catch(err => {           reject(err)         })       })     },   },   mutations: {     changeNameFun (state, val) {       state.name = val     }   },
}
export default peopleInfo

在store的入口文件引入该模块：

......
import peopleInfo from './peopleInfo.js'
........
const store = new Vuex.Store({
  state,
  getters,
  mutations,
  modules: {
    peopleInfo
  }
})
export default stores

　用模块中定义的state,getters,actions,mutations时，store操作.模块名.执行动作

   比如：this.$store.state.peopleInfo.name, this.$store.commit("peopleInfo/mutations'','wang'), this.$store.dispatch('peopleInfo/actions')等等

参考文章：https://blog.csdn.net/fuck487/article/details/83411856