Vuex的API文件說明詳解
概述
import Vuex from 'vuex'
const store = new Vuex.Store({ ...options })
構造器選項
state
型別: Object
Vuex store 例項的根 state 物件
mutations
型別: { [type: string]: Function }
在 store 上註冊 mutation,處理函式總是接受 state 作為第一個引數(如果定義在模組中,則為模組的區域性狀態),payload 作為第二個引數(可選)
actions
型別: { [type: string]: Function }
在 store 上註冊 action。處理函式接受一個 context 物件,包含以下屬性:
{ state,// 等同於 store.state,若在模組中則為區域性狀態 rootState,只存在於模組中 commit,// 等同於 store.commit dispatch,// 等同於 store.dispatch getters // 等同於 store.getters }
getters
型別: { [key: string]: Function }
在 store 上註冊 getter,getter 方法接受以下引數:
state, // 如果在模組中定義則為模組的區域性狀態
getters, // 等同於 store.getters
當定義在一個模組裡時會特別一些
state, // 如果在模組中定義則為模組的區域性狀態
getters, // 等同於 store.getters
rootState // 等同於 store.state
rootGetters // 所有 getters
註冊的 getter 暴露為 store.getters
modules
型別: Object
包含了子模組的物件,會被合併到 store
{ key: { state,namespaced?,mutations,actions?,getters?,modules? },... }
與根模組的選項一樣,每個模組也包含 state 和 mutations 選項。模組的狀態使用 key 關聯到 store 的根狀態。模組的 mutation 和 getter 只會接收 module 的區域性狀態作為第一個引數,而不是根狀態,並且模組 action 的 context.state 同樣指向區域性狀態
plugins
型別: Array<Function>
一個數組,包含應用在 store 上的外掛方法。這些外掛直接接收 store 作為唯一引數,可以監聽 mutation(用於外部地資料持久化、記錄或除錯)或者提交 mutation (用於內部資料,例如 websocket 或 某些觀察者)
strict
型別: Boolean
預設值: false
使 Vuex store 進入嚴格模式,在嚴格模式下,任何 mutation 處理函式以外修改 Vuex state 都會丟擲錯誤
例項屬性
state
型別: Object
根狀態,只讀
getters
型別: Object
暴露出註冊的 getter,只讀
例項方法
commit(type: string,payload?: any,options?: Object) | commit(mutation: Object,options?: Object)
提交 mutation。options 裡可以有 root: true,它允許在名稱空間模組裡提交根的 mutation
dispatch(type: string,options?: Object) | dispatch(action: Object,options?: Object)
分發 action。options 裡可以有 root: true,它允許在名稱空間模組裡分發根的 action。返回一個解析所有被觸發的 action 處理器的 Promise
replaceState(state: Object)
替換 store 的根狀態,僅用狀態合併或時光旅行除錯
watch(getter: Function,cb: Function,options?: Object)
響應式地監測一個 getter 方法的返回值,當值改變時呼叫回撥函式。getter 接收 store 的狀態作為唯一引數。接收一個可選的物件引數表示 Vue 的 vm.$watch 方法的引數。
要停止監測,直接呼叫返回的處理函式
subscribe(handler: Function)
註冊監聽 store 的 mutation。handler 會在每個 mutation 完成後呼叫,接收 mutation 和經過 mutation 後的狀態作為引數
store.subscribe((mutation,state) => { console.log(mutation.type) console.log(mutation.payload) })
通常用於外掛
registerModule(path: string | Array<string>,module: Module)
註冊一個動態模組
unregisterModule(path: string | Array<string>)
解除安裝一個動態模組
hotUpdate(newOptions: Object)
熱替換新的 action 和 mutation
輔助函式
mapState(namespace?: string,map: Array<string> | Object): Object
為元件建立計算屬性以返回 Vuex store 中的狀態。第一個引數是可選的,可以是一個名稱空間字串
mapGetters(namespace?: string,map: Array<string> | Object): Object
為元件建立計算屬性以返回 getter 的返回值。第一個引數是可選的,可以是一個名稱空間字串
mapActions(namespace?: string,map: Array<string> | Object): Object
建立元件方法分發 action。第一個引數是可選的,可以是一個名稱空間字串
mapMutations(namespace?: string,map: Array<string> | Object): Object
建立元件方法提交 mutation。第一個引數是可選的,可以是一個名稱空間字串
createNamespacedHelpers(namespace: string): Object
更多關於VUEX方面的相關知識請點選下面的相關連結