web-dev-qa-db-ja.com

2つの名前空間を持つvuexモジュール間でアクションを振り分ける方法はありますか?

名前空間付きモジュール間でアクションをディスパッチすることは可能ですか?

例えば。私はvuexモジュール "gameboard"と "notification"を持っています。それぞれ名前空間です。ゲームボードから通知モジュールにアクションを送りたいのですが。

私はこのようにディスパッチアクション名にモジュール名を使用できると思いました。

// store/modules/gameboard.js
const actions = {
    myaction ({dispatch}) {
        ...
        dispatch('notification/triggerSelfDismissingNotifcation', {...})
    }
}

// store/modules/notification.js
const actions = {
    triggerSelfDismissingNotification (context, payload) {
        ...
    }
}

しかし、これを行おうとすると、vuexが私のゲームボードモジュール内でアクションをディスパッチしようとしているというエラーになります。

[vuex]不明なローカルアクションタイプ:notification/triggerSelfDismissingNotification、グローバルタイプ:gameboard/notification/triggerSelfDismissingNotification

Vuexモジュールからモジュールへディスパッチする方法はありますか?それとも、ルートvuexインスタンスにある種のブリッジを作成する必要がありますか?

85
Chris Schmitz

ルートコンテキストからディスパッチしていることを指定するだけです。

// from the gameboard.js vuex module
dispatch('notification/triggerSelfDismissingNotifcation', {...}, {root:true})

これで、ディスパッチがルートに到達すると、通知モジュールへの正しいルートネームパス(ルートインスタンスに対する相対パス)が設定されます。

これはあなたがあなたのvuexストアモジュールでnamespaced: trueを設定していると仮定しています。

213
Jake