当项目包含多个模块,例如:登录模块,商品模块等,每个模块中都含有大量需要组件共享的状态,此时就要用到vuex的模块化管理了。
给项目安装vuex
npm install vuex --save
等vuex安装完成,src文件夹下创建store文件夹,store文件夹下是index.js和login.js文件
//index.js
import Vue from 'vue'
import Vuex from 'vuex'
import login from './login.js'
Vue.use(Vuex)
export default new Vuex.Store({
state:{},
mutations:{},
getters:{},
actions:{},
modules:{
login
}
})
//login.js
export default {
namespaced: true,
state:{
users:[
{
id:'01',
name:'Leo'
},
{
id:'02',
name:'Tom'
}
]
},
mutations:{
addUser(state,payload){
state.users.push(payload)
}
},
getters:{
getNameById(state)