vuex模块化+命名空间

一说起模块化就要想到优化，提高复用性，让多种数据的分类更加明确

1. 修改store.js

将原来混合的不同板块的数据按照类别分开，此处分为了两类，countAbout，personAbout。每一类中都有state，mutations，actions，getters，在分类了之后要开启命名空间，这样就可以避免插值语法中的内容过长所造成的不简洁

const countAbout = {
     namespaced:true,//开启命名空间
     state:{x:1},
     mutations: { ... },
     actions: { ... },
     getters: {
       bigSum(state){
          return state.sum * 10
       }
     }
   }
   
   const personAbout = {
     namespaced:true,//开启命名空间
     state:{ ... },
     mutations: { ... },
     actions: { ... }
   }
   
   const store = new Vuex.Store({
     modules: {
       countAbout,
       personAbout
     }
   })

2. 开启命名空间后，组件中读取state数据：

//在组件的文件中  
//方式一：自己直接读取
   this.$store.state.personAbout.list
   //方式二：借助mapState读取：
   ...mapState('countAbout