API リファレンス
Vuex.Store
import Vuex from 'vuex'
const store = new Vuex.Store({ ...options })
Vuex.Store コンストラクタオプション
state
mutations
型:
{ [type: string]: Function }ストアにミューテーションを登録します。ハンドラ関数は第一引数に
stateを常に受け取り(モジュール内で定義されていれば、モジュールのローカルステートを受け取り)、指定されていれば第二引数にpayloadを受け取ります。
actions
型:
{ [type: string]: Function }ストアにアクションを登録します。ハンドラ関数は次のプロパティを持つ
contextオブジェクトを受け取ります。:{ state, // `store.state` と同じか、モジュール内にあればローカルステート rootState, // `store.state` と同じ。ただしモジュール内に限る commit, // `store.commit` と同じ dispatch, // `store.dispatch` と同じ getters, // `store.getters` と同じか、モジュール内にあればローカルゲッター rootGetters // `store.getters` と同じ。ただしモジュール内に限る }
getters
type:
{ [key: string]: Function }ストアにゲッターを登録します. ゲッター関数は次の引数を受け取ります:
state, // モジュール内で定義されていればモジュールのローカルステート getters // store.getters と同じモジュールで定義されたときの仕様
state, // モジュールで定義された場合、モジュールのローカルステート getters, // 現在のモジュールのモジュールのローカルゲッター rootState, // グローバルステート rootGetters // 全てのゲッター登録されたゲッターは
store.getters上に公開されます。
modules
型:
Objectサブモジュールを含む次のような形式のオブジェクトはストアにマージされます。
{ key: { state, mutations actions?, getters?, modules? }, ... }各モジュールは、ルートオプションに似た
stateとmutationsを含むことができます。モジュールの状態は、モジュールのキーを使って、ストアのルートステートに結合されます。モジュールのミューテーションとゲッターは、第一引数としてルートステートの代わりに、モジュールのローカルステートだけを受け取り、モジュールのアクションのcontext.stateもローカルステートを指すようになります。
plugins
型:
Array<Function>プラグイン関数の配列は、ストアに適用されます。このプラグインは、ストアだけを引数として受け取り、外部への永続化、ロギング、デバッギングのために、ミューテーションを監視するか、または、 websocket や observable のような外から渡されるデータのためにミューテーションをディスパッチします。
strict
- 型:
Boolean デフォルト:
falseVuex ストアを厳格モードにします。厳格モードでは、ミューテーションハンドラ以外で、 Vuex の状態の変更を行うと、エラーが投げられます。
- 型:
Vuex.Store インスタンスプロパティ
state
type:
Objectルートステート、読み取り専用です。
getters
type:
Object登録されているゲッターを公開します。読み取り専用です。
Vuex.Store インスタンスメソッド
commit(type: string, payload?: any, options?: Object) | commit(mutation: Object, options?: Object)ミューテーションをコミットします。
optionsは名前空間付きモジュールで root なミューテーションにコミットできるroot: trueを持つことできます。詳細dispatch(type: string, payload?: any, options?: Object) | dispatch(action: Object, options?: Object)アクションをディスパッチします。
optionsは名前空間付きモジュールで root なアクションにディスパッチできるroot: trueを持つことできます。 すべてのトリガーされたアクションハンドラを解決するPromiseを返します。詳細replaceState(state: Object)ストアのルートステートを置き換えます。これは、ステートのハイドレーションやタイムトラベルのためだけに利用すべきです。
watch(getter: Function, cb: Function, options?: Object)リアクティブにゲッター関数の返す値を監視します。値が変わった場合は、コールバックを呼びます。ゲッターはストアの
stateを最初の引数として、gettersを2番目の引数として受け取ります。 Vue のvm.$watchメソッドと同じオプションをオプションのオブジェクトとして受け付けます。監視を止める場合は、ハンドラ関数の返り値を関数として呼び出します。
subscribe(handler: Function)ストアへのミューテーションを購読します。
handlerは、全てのミューテーションの後に呼ばれ、引数として、ミューテーション ディスクリプタとミューテーション後の状態を受け取ります。store.subscribe((mutation, state) => { console.log(mutation.type) console.log(mutation.payload) })プラグインの中でもっともよく利用されます。詳細
subscribeAction(handler: Function)2.5.0 で新規追加
ストアアクションを購読します。
handlerはディスパッチされたアクションごとに呼び出され、アクション記述子と現在のストア状態を引数として受け取ります:store.subscribeAction((action, state) => { console.log(action.type) console.log(action.payload) })
プラグインで最も一般的に使用されます。Details
registerModule(path: string | Array<string>, module: Module, options?: Object)動的なモジュールを登録します。詳細
optionsは前の状態を保存するpreserveState: trueを持つことができます。サーバサイドレンダリングに役立ちます。unregisterModule(path: string | Array<string>)動的なモジュールを解除します。詳細
hotUpdate(newOptions: Object)新しいアクションとミューテーションをホットスワップします。詳細
コンポーネントをバインドするヘルパー
mapState(namespace?: string, map: Array<string> | Object): Objectストアのサブツリーを返すコンポーネントの computed オプションを作成します。詳細
第1引数は、オプションで名前空間文字列にすることができます。詳細
mapGetters(namespace?: string, map: Array<string> | Object): Objectゲッターの評価後の値を返すコンポーネントの computed オプションを作成します。詳細
第1引数は、オプションで名前空間文字列にすることができます。詳細
mapActions(namespace?: string, map: Array<string> | Object): Objectアクションをディスパッチするコンポーネントの methods オプションを作成します。詳細
第1引数は、オプションで名前空間文字列にすることができます。詳細
mapMutations(namespace?: string, map: Array<string> | Object): Objectミューテーションをコミットするコンポーネントの methods オプションを作成します。詳細
第1引数は、オプションで名前空間文字列にすることができます。詳細
createNamespacedHelpers(namespace: string): Object名前空間付けられたコンポーネントバインディングのヘルパーを作成します。返されるオブジェクトは指定された名前空間にバインドされた
mapState、mapGetters、mapActionsそしてmapMutationsが含まれます。詳細はこちら