vuex中的store分模組管理，需要在store的index.js中引入各個模組，為了解決不同模組命名衝突的問題，將不同模組的namespaced:true，之後在不同頁面中引入getter、actions、mutations時，需要加上所屬的模組名

1、宣告分模組的store時加上namespaced:true

// initial state
const state = {
  userId:'',//使用者id
  userName:'',//使用者名稱稱
  token:'',//token
  permission:''//許可權
}

// getters
const  getters = {
  // 獲取使用者資訊
  getUserInfo(){
    return state;
  }
}

// actions
const actions = {}

// mutations
const mutations = {
  setUserInfo(state,payload) {
    console.log("payload:"+payload);
    console.info(payload);
    state.userId = payload.userId;
    state.userName = payload.userName;
    state.token = payload.token;
    state.permission = payload.permission;
  }
}

export default {
  namespaced: true,
  state,
  getters,
  actions,
  mutations
}
 

2、使用模組中的mutations、getters、actions時候，要加上模組名，例如使用commint執行mutations時

格式：模組名/模組中的mutations

xxx/setUserInfo

this.$store.commit("userInfo/setUserInfo",userInfo)

3、獲取屬性時同樣加上模組名

格式：store.state.模組名.模組屬性

$store.state.userInfo.userName