了解vuex的朋友都知道它是vue用來集中管理狀態的容器，如果了解過Reduce的朋友可能看見他時就會非常熟悉，都是用來管理全局的狀態的，實現不同組件之間相互的數據訪問。這里我們不介紹vuex,主要介紹vuex拆分store以及多模塊管理。我們知道如果一個項目非常大的話狀態就會非常的多，如果不進行分類處理，所有的狀態都維護在一個state里面的話，狀態管理就會變得非常的混亂，這樣非常不利于項目的后期維護。我們現在前端推崇模塊化開發，為的就是提高開發效率和維護效率，避免重復工作。那么vuex是怎么樣解決這個問題的呢？這個時候我們今天要講的主角modules就要閃亮登場了。
其實這個用起來是非常簡單的，正常情況下，我們在用vuex的時候我們是這樣定義的：

states.js //保存應用的狀態值

export default {  bookList:["西游記","水滸傳","紅樓夢","三國演義"]}

mutations.js //在這個文件中定義對狀態值的操作，增刪改查。

export default {//這里要注意不要在mutations里面進行異步操作  ADD_BOOK(state,book){    state.bookList.push(book);    return true;  },  DELETE_BOOK(state,id){  }}

getters.js //將我們在states中定義的值暴露在store.getters對象中，便于我們在組件中可以通過store.getters對象中，便于我們在組件中可以通過store.getters.bookList訪問數據

export default {  bookList:function(state){    return state.bookList;  }} 

actions.js //其實這里定義的方法只是將mutation.js中定義的方法進行了一次封裝,就是去觸發mutations.js中的方法。如果傳如的參數需要異步獲取的話，我們可以在這里等待異步返回成功后在觸發mutations中的方法。在組件中這兩個文件定義的方法都可以直接調用，mutations中定義的方法是通過store.dispath(′ADDBOOK′,book)調用的，而actons定義的方法是通過store.dispath(′ADDBOOK′,book)調用的，而actons定義的方法是通過store.commit(‘ADD_BOOK',book),調用的。

export default {//在action中可以進行異步操作。  add_book({commit},book){   commit('ADD_BOOK',book);  },  delete_book({commit},book){   commit('DELETE_BOOK',id);  }}

這里有時我們還可能會看見一個文件叫mutations_type.js其實這個文件定義的是mutations中的方法名,我自己在用的時候反正沒定義這個文件，自己看著辦如果喜歡你就定義上。

上面定義的文件定義好了之后，我們就可以將我們定義的這些對象加入到vuex的Store中去了
store.js

import vue from 'vue'import vuex from 'vuex'import states from './state.js'import mutatons from './mutations.js'import actons from './actions.js'import getters from './getters'vue.use(vuex);export default new vuex.Store({          ststes,          mutatons,          getters,          actions         });