Vuex是什么？

Vuex是一個專門為Vue.js應(yīng)用程序開發(fā)的“狀態(tài)管理模式”。它采用集中儲存管理應(yīng)用的所有組件的狀態(tài)，并加以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測的方式變化。

什么是“狀態(tài)管理模式”？

讓我們從一個簡單的Vue計數(shù)應(yīng)用開始分析：

newVue({// statedata(){return{count:0}},// viewtemplate:`<div>{{count}}</div>`,// actionsmethods:{increment(){this.count++}}})

單向數(shù)據(jù)流

通過代碼和圖我們可以看到，data里是驅(qū)動應(yīng)用的數(shù)據(jù)源（state），template是反應(yīng)數(shù)據(jù)的視圖窗口（View），method里的increment，響應(yīng)view上用戶的輸入操作（Actions）

這三兄弟在一個組件內(nèi)運行沒問題，但是如果現(xiàn)在State，View，Actions同時出現(xiàn)在多個組件里，那樣狀態(tài)就會很混亂

多個視圖（view）依賴同一個狀態(tài)（state）。

來自不同的視圖的行為（actions）需要改變同一個狀態(tài)（state）。

對于問題一，傳參的方法對于多層嵌套將會非常麻煩，并且兄弟之間的組件傳遞無能為力。

對于問題二，我們經(jīng)常會采用父子組件直接引用或者通過事件變更和同步狀態(tài)的多份拷貝。以上的模式都非常脆弱和難以維護(hù)。

因此，Vuex把組件的共享狀態(tài)抽取出來，以一個全局單例模式管理。組建樹構(gòu)成了一個巨大的‘視圖’，不管在樹的哪個位置，任何組件都能獲取狀態(tài)或者出發(fā)行為。利用Vue.js的細(xì)粒度數(shù)據(jù)響應(yīng)機制進(jìn)行高效的狀態(tài)更新。

什么情況下使用Vuex？

看完上面的介紹，你應(yīng)該明白，Vuex的出現(xiàn)，就是一個統(tǒng)一的狀態(tài)管理工具，如果你在項目中并沒有太多的共享狀態(tài)，那你可以不用，當(dāng)你被共享的狀態(tài)搞得焦頭爛額時，那你一定要馬上使用它。引用Redux的作者的話就是

Flux就像是眼睛：你自然會知道是什么時候需要它。

引用

https://vuex.vuejs.orgVuex官方文檔

作者：我王某不需要昵稱

鏈接：http://www.itdecent.cn/p/fb158a1758e0

來源：簡書

著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。