J'ai deux composantes qui n'ont pas de relation parent - enfant. Ils ne sont pas liés les uns aux autres. Mais j'essaie de le faire pour que lorsqu'un événement soit émis d'un composant, l'autre composant peut écouter cet événement et effectuer une action.
Voici un exemple, disons que j'ai un composant appelé "réinitialisation composant "et à un moment donné, il émettra un événement appelé" réinitialiser ". p> et j'ai également un" composant de grille "qui devrait écouter l'action" Réinitialiser " émis par le "composant de réinitialisation" et effectuer une action. P> // Reset component
EventBus.$emit('reset')
// Grid component
created()
{
EventBus.$on('reset', () => {
doSomething()
})
}
5 Réponses :
Vous pouvez utiliser Sujet pour y accomplir. Voir ce lien pour plus d'informations: VUE.JS + RXJS - Communiquer entre les composants avec Observable et Sujet
C'est une sorte de la même idée qu'un émetteur / écouteur d'événement mondial
Vous avez en réalité plusieurs options. Mais comme vous avez déjà répondu à vous-même, un bus d'événement global est l'un d'entre eux
dans votre fichier principal (supposez quelque chose comme Main.Js), vous pouvez faire P>
created () {
this.$bus.$on('reset', this.doReset)
}
Je suis d'accord, mon application est si petite qu'il n'y a aucune raison d'apporter une grande bibliothèque comme Vuex, donc je cherchais des alternatives. On dirait que la seule option vraie viable est un bus global ..
Y a-t-il un problème avec un bus d'événement mondial?
J'ai entendu dire que cela s'appelle un anti-modèle car il est difficile de comprendre où les événements proviennent d'un bus d'événement mondial.
Lorsque vous passez des accessoires aux composants enfants et les événements émettrices aux composants des parents deviennent durs en raison de la complexité de distance ou de l'application, vous pouvez utiliser VUEX: https://vuex.vuejs.org/
Eh bien, mon application est très petite, donc je ne voulais pas apporter une grosse bibliothèque comme VUEX pour cette tâche.
Vous pouvez également simplement ajouter aux instances hameçons:
Mais je suppose que cela créera une relation. réinitialisant. $ sur ("réinitialiser", dosmth)
Oui, vous pouvez utiliser dans votre Et puis vous pouvez alors l'écouter,
vm. $ sur et vm. $ émet dans les composants.
réinitialiser-composant Déclenchez l'événement de n'importe quelle méthode ou élément
ceci. $ EMIT ('RESET')
Envisager d'utiliser VUEX (Global State Manager) pour éviter des problèmes comme celui-ci