關於vue vuex的一些初步小結

一般語法：

vue.component(tagname, options)

元件options說明：

bar = val">

好了，這裡涉及的概念可能比較多，所以再多解釋一下吧～為了邏輯上更加清新，vue是不推薦子元件改變父元件的資料的，主要是出於維護成本的考慮，這就是所謂的單向資料流。父元件可以通過改變prop影響子元件資料，而子元件可以通過emit觸發父元件方法。

但是，如果這樣的資料傳遞不僅僅限於父子元件之間，而是祖先與後代元件或是兄弟元件呢？顯然這會是一件很麻煩的事，為了處理這種多狀態、多通訊的情形，我們引入了vuex。

如果你之前使用過flux、redux等狀態狀態管理工具的話，那麼應該會很容易理解這個工具是要做什麼～

下面依次介紹一下state、mutation和action這三個核心概念：

是乙個持久化儲存的狀態，不歸屬於vue的某個特定元件，除非重新整理頁面，否則資料不會消失～

在根例項中註冊store，下發到所有子元件，使用如下：

computed: 
}

如果想要簡化定義，使用mapstate輔助函式就可，使用時從vuex引入該方法就可。

state的值不能直接被操作，想要改變它必須通過提交mutation的形式進行，方式為：

store.commit('something', payload)

注意一下第二個引數，這是以載荷形式提交引數，引數最多乙個，想傳多個引數的話必須以物件的形式提交。

mutation只能是同步函式，原因是devtool無法捕捉非同步函式的快照。

為了執行非同步操作，vuex引入了action來完成這一工作，呼叫方式是用dispatch方法，簡化寫法與state和mutation是類似的，值得看看的是將它和es6的promise和es7的async與await結合起來的工作原理：

actions: ) , 1000)
})}}

這個action返回了乙個promise物件，可以在後續進行處理，同時action中也可以呼叫其他非同步action。

除了這三個概念外，還有getter（模擬計算屬性，用於從state派生出一些值）、module（分割較大的狀態樹，便於管理）。

處理表單可手動監聽input、change或是使用帶setter的雙向繫結計算屬性。