C'è un modo per inviare azioni tra due moduli vuex spaziati dal nome?

159

È possibile inviare un'azione tra moduli con spazio dei nomi?

Ad esempio, ho moduli vuex "gameboard" e "notification". Ognuno è spaziato dai nomi. Vorrei inviare un'azione dal tabellone al modulo di notifica.

Pensavo di poter usare il nome del modulo nel nome dell'azione di invio in questo modo:

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

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

Ma quando provo a farlo ottengo errori che mi fanno pensare che Vuex stia cercando di inviare un'azione all'interno del mio modulo di gioco:

[vuex] tipo di azione locale sconosciuto: notification / triggerSelfDismissingNotification, tipo globale: gameboard / notification / triggerSelfDismissingNotification

Esiste un modo per inviare da un modulo vuex a un modulo o devo creare una sorta di bridge nell'istanza di root vuex?

vue.js vuejs2 vuex

— Chris Schmitz
fonte

Risposte:

344

Devi solo specificare che stai inviando dal contesto di root:

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

Ora quando l'invio raggiunge la radice avrà il percorso dello spazio dei nomi corretto per il modulo di notifica (relativo all'istanza di root).

Questo presuppone che tu stia impostando namespaced: trueil tuo modulo store vuex.

— Jake
fonte

Questo è l'unico successo su Internet per la mia ricerca di una soluzione. Grazie per aver risposto.

— Peter Roehlen,

Ad essere onesti, è documentato qui vuex.vuejs.org/en/modules.html in "Accesso alle risorse globali nei moduli basati su nomi". Anche se è un po 'scomodo da accogliere.

— Jake,

Adoro Vue, ma mi sembra che Vuex aggiunga più livelli di difficoltà piuttosto che renderlo più semplice. Ora so che questo non è lo scopo di Vuex ma comunque, non è fastidioso che abbia sempre bisogno di essere consapevole di alcune convenzioni come in questo esempio notification/trigger, quindi se voglio che sia un po 'più generico lo faccio ${NOTIF_TYPE_NAME}/${NOTIF_TRIGGER_ACTION}, comunque ho bisogno di una barra, o anche di creare una funzione di supporto per questo, sento che quando voglio che la mia app sia più modulare pago molto più di quanto ottengo. Questa è la mia opinione

— Dima Gimburg,

È possibile utilizzare this.dispatch. Non serve {root: true}. Questo è globale.

— MKatleast3

No, devi usare {root: true}. Il caso che intendevi è probabilmente l'invio a un modulo figlio, che in effetti (e ovviamente) non ha bisogno di questo flag.

— kursus,

Come menzionato @ MKatleast3

È possibile utilizzare this.dispatch. Non è necessario {root: true}nelle opzioni di spedizione. Questo è globale.

— Slowaways
fonte