Centre d'événements global Bus en vue (tutoriel détaillé)

ue-bus fournit un centre d'événements global et l'injecte dans chaque composant. Vous pouvez utiliser les événements globaux aussi facilement qu'en utilisant le flux d'événements intégré. Cet article vous présente une démo simple du centre d'événements global vue bus. Les amis qui en ont besoin peuvent s'y référer

1 Après avoir construit le projet avec vue-cli, utilisez npm pour installer vue-bus

 npm install vue-bus

2. Inscrivez-vous globalement

 import Vue from 'vue';
 import VueBus from 'vue-bus';
 Vue.use(VueBus);

3. 🎜>

4. Recevoir des données :

this.$bus.emit("eventName",data)

5. la portée de ceci doit pointer vers l'instance de machine virtuelle actuelle. L'événement d'écoute est généralement placé dans la fonction de cycle de vie du composant. La désinscription du bus doit être dans beforeDestroy ; times Le problème, d'une part, peut être dû au fait que le composant Vue est réutilisé, provoquant l'enregistrement répété d'un événement de bus, détruisant le bus "même nom d'événement", la seule relation correspondante entre l'envoi et la réception

this.$bus.on("eventName",data)

Par contre, lors du routage de page, l'événement de bus dans la page d'origine n'a pas été déconnecté et est toujours masqué dans le programme.

Ce qui précède est ce que j'ai compilé pour vous. J'espère que cela vous sera utile à l'avenir.

Articles associés :

Méthodes de mise à jour $set et tableau dans vue.js_vue.js

JQuery select select La valeur La méthode du composant sélectionné

vue est combinée avec vue-i18n pour implémenter la méthode de commutation multilingue des données d'arrière-plan

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!