更新時(shí)間:2022年07月11日11時(shí)30分 來源:傳智教育 瀏覽次數(shù):
Vuex的5個(gè)核心屬性分別是 State、 Getter、Mutation 、Action、Module。
1)state
state 為單一狀態(tài)樹,在 state 中需要定義我們所需要管理的數(shù)組、對象、字符串等等,只有在這里定義了,在 Vue.js 的組件中才能獲取你定義的這個(gè)對象的狀態(tài)。
2)getter
getter 有點(diǎn)類似 Vue.js 的計(jì)算屬性,當(dāng)我們需要從 store 的 state中派生出一些狀態(tài),那么我們就需要使用 getter,getter 會(huì)接收 state 作為第一個(gè)參數(shù),而且 getter 的返回值會(huì)根據(jù)它的依賴被緩存起來,只有 getter 中的依賴值(state 中的某個(gè)需要派生狀態(tài)的值)發(fā)生改變的時(shí)候才會(huì)被重新計(jì)算。
3)mutation
更改 store 中 state 狀態(tài)的唯一方法就是提交 mutation,就很類似事件。每個(gè) mutation 都有一個(gè)字符串類型的事件類型和一個(gè)回調(diào)函數(shù),我們需要改變 state 的值就要在回調(diào)函數(shù)中改變。我們要執(zhí)行這個(gè)回調(diào)函數(shù),那么我們需要執(zhí)行一個(gè)相應(yīng)的調(diào)用方法:store.commit。
4)action
action 可以提交 mutation,在 action 中可以執(zhí)行 store.commit,而且 action 中可以有任何的異步操作。在頁面中如果我們要嗲用這個(gè) action,則需要執(zhí)行 store.dispatch。
5)module
module 其實(shí)只是解決了當(dāng) state 中很復(fù)雜臃腫的時(shí)候,module 可以將 store 分割成模塊,每個(gè)模塊中擁有自己的 state、mutation、action和 getter。
北京校區(qū)