一：src目錄下新建store目錄用來寫vuex的各個(gè)模塊
二：store目錄下新建state.js文件,該文件內(nèi)寫將要用vuex存儲(chǔ)的數(shù)據(jù)，目前先存儲(chǔ)一個(gè)登錄狀態(tài)login和角色role
三：store目錄下新建mutations.js文件抢蚀，該文件用來定義? 修改state.js內(nèi)部的數(shù)據(jù)? 的函數(shù)
?想要修改 state.js內(nèi)部定義的變量渠旁，必須用mutations.js內(nèi)部相應(yīng)的方法進(jìn)行修改
四：store目錄下新建actions.js攀例，
使用場景：比如我們一個(gè)h5商城，后端會(huì)在登錄成功的的接口中返回cookie以及角色類型顾腊，然后將cookie自動(dòng)存儲(chǔ)在瀏覽器的緩存中粤铭；在登錄成功之前，我們都是無cookie去后端請(qǐng)求數(shù)據(jù)杂靶，用戶看到的信息也是未登錄才能看到的信息梆惯；一旦登錄成功，cookie已經(jīng)存儲(chǔ)在瀏覽器中吗垮，這時(shí)候請(qǐng)求中就可以帶上cookie垛吗，用戶就可以看到登錄之后的信息。
像這種權(quán)限判斷烁登，我們需要在全局路由中進(jìn)行判斷职烧，角色請(qǐng)求這塊可以actions中封裝，因?yàn)槊總€(gè)頁面可能都涉及權(quán)限的判斷（有cookie直接請(qǐng)求權(quán)限接口，設(shè)置role蚀之；沒cookie蝗敢，在登錄成功進(jìn)行跳轉(zhuǎn)的時(shí)候，設(shè)置role）足删，封裝起來用著更方便
五：store目錄下新建index.js文件
六：在項(xiàng)目的入口文件main.js中引入store/index.js文件,然后在vue實(shí)例中進(jìn)行注入
import store from './store'
此時(shí)我們就可以去相應(yīng)的組件內(nèi)部 獲取 或者 修改 vuex存儲(chǔ)的數(shù)據(jù)
調(diào)用mutations可以使用...mapMutations寿谴，這樣相當(dāng)于給方法其一個(gè)別名；我們也可以使用this.$store.commit('SET_LOGIN',? true）失受；異步使用actions讶泰，調(diào)用方式是 thiiis.$store.dispatch('actionsFnName')
上面是修改vuex中的login值，那看一下如何獲取vuex的login值
可以根據(jù)以上兩種方式進(jìn)行獲取拂到，vuex內(nèi)部的值放在computed可以實(shí)現(xiàn)數(shù)據(jù)的實(shí)時(shí)變化痪署；當(dāng)然也可以通過this.$store.state.login進(jìn)行獲取。
對(duì)于actions的使用場景兄旬，可能一兩句說不清楚狼犯。很多地方都說的是? 異步存儲(chǔ)用actions，但是異步的可以直接在回調(diào)中調(diào)用mutation领铐，為什么要把異步的業(yè)務(wù)邏輯放在acrions中去實(shí)現(xiàn)悯森，而不是直接在頁面的對(duì)應(yīng)邏輯中實(shí)現(xiàn)
同步調(diào)用的用mutation，當(dāng)涉及到異步調(diào)用且有復(fù)用可能的绪撵，或者有將業(yè)務(wù)邏輯封裝起來的需要用action瓢姻，異步無復(fù)用可能的直接使用mutations即可
