vuex 定義

vuex是什麼?vue

vuex是一個專爲vue.js應用程序開發的狀態管理模式,它採用集中式存儲管理應用的全部組件的狀態,並以相應的規則保證狀態以一種可預測的方式發生變化。Vuex也集成到vue的官方調試工具devtools extension ,提供了諸如零配置的time-travel調試、狀態快照導入導出等高級調試功能。vuex

什麼是‘狀態管理模式’?redux

讓我從一個簡單的vue計數應用開始:ide

new Vue({工具

//stateui

data(){this

return {設計

count:0調試

}blog

},

//view

template:'

<div>{{count}}</div>

',

//actions

methods:{

increment:function(){

this.count++

}

}

})

這個狀態自管理應用包含如下幾個部分:

  • state,驅動應用的數據源
  • view,以聲明方式將state映射到視圖
  • actions,響應在view上的用戶輸入致使的狀態變化

如下是一個表示「單向數據流」理念的極簡示意:

可是,當咱們的應用遇到多個組件共享狀態時,單向數據流的簡潔性很容易被破壞

  • 多個視圖依賴於同一狀態
  • 來自不一樣視圖的行爲須要變動同一狀態

對於問題-,傳參的方法對於多層嵌套的組件將會很是繁瑣,而且對於兄弟組件間的傳遞也是無能爲力。對於問題二,咱們常常會採用父子組件直接引用或者經過事件來變動和同步狀態的多份拷貝。以上的這些模式很是脆弱,一般會致使沒法維護的代碼。

所以,爲何咱們不把組件的共享狀態抽取出來,以一個全局單例模式管理呢?在這種模式下,咱們的組件樹構成了一個巨大的視圖,無論在樹的那個位置,任何組件都能獲取狀態或者觸發行爲。

另外,經過定義和隔離狀態管理中的各類概念並強制遵循必定的規則,咱們的代碼會變得更結構化且易於管理。

這就是vuex背後的基本思想,借鑑了flux,redux和the elm  Architecture。與其餘模式不一樣的是,Vuex是專門爲vue.js設計的狀態管理庫,以利用vue.js的細粒度數據響應機制來進行高效的狀態更新。

相關文章
相關標籤/搜索