[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，我們就需要加上命名空間了