vuex的模块化和namespaced

这里主要是将store里面的index.js这个文件变得更加有条理性一点，使得整个代码看起来比较清晰

主要的变动在于count.vue,person.vue,index.js

count.vue

person.vue

index.js

//该文件用于创建VUex中最为核心的store

import Vue from 'vue'

//引入Vuex
import Vuex from 'vuex'
//应用vuex插件
Vue.use(Vuex)

//求和相关配置
const countOptions ={
    namespaced:true,
    actions:{
        jiaOdd(context,value){
        console.log('actions中的jiaOdd被调用了')
        if(context.state.sum % 2){
            context.commit('JIA',value)
        } 
    },
        jiaWait(context,value){
        console.log('actions中的jiaWait被调用了')
        setTimeout(() => {
            context.commit('JIA',value)
        }, 500);
    }},
    mutations:{
        JIA(state,value){
        console.log('mutations中的JIA被调用了')
        state.sum +=value
    },
        JIAN(state,value){
        console.log('mutations中的JIAN被调用勒')
        state.sum -=value
    },},
    state:{
        sum:0, //当前的和 
        school:'尚硅谷',
        subject:'前端',
    },
    getters:{
        bigSum(state){
            return state.sum*10
        }
    }
}

//人员管理相关配置
const personOptions ={
    namespaced:true,
    actions:{},
    mutations:{
        ADD_PERSON(state,value){
        console.log('mutations中的ADD_PERSON被调用勒')
        state.personList.unshift(value)
    }},
    state:{
        personList:[
            {id:'001',name:'张三'}
        ]
    },
    getters:{}
}


//创建并暴露store
export default new Vuex.Store({
    modules:{
        countAbout:countOptions,
        personAbout:personOptions
    }
})