[toc] ## pre `mapXx`是vuex为我们提供的方法 ``` import {mapState,mapGetters,mapActions,mapMutations} from 'vuex'; ``` 它帮助我们更方便的调用存在于`this.$store`里的属性和方法 --- 我们可以通过`mapState`、`mapGetters`、`mapActions`、`mapMutations` 将store里的`state`、`gettes`、`actions`、`mutations`的某些属性映射成某个组件的属性 mapXX们，都接受一个参数 ，有两种形式 数组的形式 ``` ,...mapGetters(['fullName','a/textPlus']) ``` 对象的形式 ``` ...mapState({ counter: (state) => state.count ,textA:(state)=>state.a.text ,textB:(state)=>state.b.text }) ``` 使用对象的形式能给仓库里的数据更名映射到组件上 而使用数组的形式则更为快捷 ## 关于modules 一个仓库可能被分隔成很多"份"，每一份都是完整的一个小型store，存储着某个组件所需要的所有数据 而这种情况下，我们一般需要往state里再往下遍历一级，才能拿到所需要的数据（因为state依旧是所有数据的state，而不是其中的一份state） ``` ...mapState({ counter: (state) => state.count ,textA:(state)=>state.a.text ,textB:(state)=>state.b.text }) ``` 比如这里获取的是全局下count属性和a模块下的text数据以及b模块下的text数据 但需要注意的是，如果该数据不是state，**而是**muations、actions这种**方法**的话 我们一般不需要加命名空间，因为默认modules下的muation、actions的方法名是全局的而不是局部的 ``` ,methods:{ ...mapActions(['updateCountAsync']) // ,...mapMutations(['updateCount','updateText']) //但如果将子模块的namespaced设置为true，需要↓ ,...mapMutations(['updateCount','a/updateText']) //然后这样调用this['a/updateText]('123') } ``` 但如果将子模块的namespaced设置为true，我们就需要加上命名空间了