vuex 模块化

将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块

const state = {
    username: "李瑶",
    id: "007",
}
const mutations = {
    changeUserName: (state, payload) => {
        state.username = payload
    },
    changeId: (state, payload) => {
        state.id = payload
    }
}
const actions = {
    AsyncChangeUserName({ commit },payload) {
        commit("changeUserName",payload)
    },
    AsyncChangeId({ commit },payload) {
        commit("changeId",payload)
    }
}
export default {
    namespaced: true,
    state,
    mutations,
    actions
}

//index.js
import Vue from 'vue'
import vuex from 'vuex'
// app模块
import app from "./modules/app"
Vue.use(vuex);
export default new vuex.Store({
    state: {
        count: 100,
        name: "ly",
    },
    mutations: {
        add(state, n) {
            state.count += n
        },
        reduce(state) {
            state.count--
        }
    },
    modules: { app }
})