vuex狀態管理模式之Getters屬性

2021-08-20 16:37:57 字數 1010 閱讀 1367

getters我們可以理解為store倉庫的乙個計算屬性,它的作用主要是用來派生出一些新的狀態。比如我們要把state狀態的資料進行一次對映或者篩選,再把這個結果重新計算並提供給元件使用。舉個例子:

此時,getters會暴露出乙個store.getters物件,我們就可以在任何元件中使用this.$store.getters.***來繫結資料。

但是上面寫法還是不夠簡便,假如我getters狀態多的時候,就得重複這樣的寫法,很麻煩,也不夠美觀,vuex給我們提供了另外乙個方法mapgetters顧名思義就是對映多個getters。下面我們再改一下上面的**(使用es6語法)。

然後我們可以使用vuex提供的mapgetters方法來繫結多個getters物件。在結合es6...物件運算子來合併我們元件的本地計算屬性。

最後如果我們想給getters屬性起個別名,我們可以通過物件的形式:

vuex 狀態管理模式

vuex 是乙個專為 vue.js 應用程式開發的狀態管理模式。初始化store index.jsimport vue from vue import vuex from vuex vue.use vuex const store newvuex.store export default store...

Vuex狀態管理模式

官方文件 vuex實現共享狀態管理,實際就是管理裡面的state的相應值 import vue from vue import vuex from vuex vue.use vuex export default newvuex.store mutations getters actions mod...

Vue之Vuex 狀態管理模式

簡介 vuex 狀態管理模式 是vue.js應用程式開發的狀態管理模式,它採用集中式儲存管理應用的所有元件的狀態,並以相應的規則保證狀態以一種可 的方式發生變化。作用 解決不同元件之間的資料共享 解決元件的資料儲存問題 實現 首先,在store.js例項化乙個vuex,用來對資料進行儲存 impor...