VueJS 2 - Comment Passer des Paramètres à l'Aide de $émettent

Je suis en train de travailler sur un modal composant à l'aide de VueJS 2. Maintenant, il fonctionne en fait -- je clique sur un bouton et la modale s'ouvre, etc.

Ce que je veux faire maintenant, c'est de créer un nom unique pour le modal et d'associer le bouton avec le bouton.

C'est ce que j'ai à l'esprit. Le modal a un nom unique propriété:

<modal name='myName'>CONTENT</modal>

Et ce serait le bouton associer:

<button @click="showModal('myName')"></button>

Ce que j'ai besoin de savoir comment passer le paramètre de showModal à la composante modale.

Voici la méthode que j'utilise dans la racine de vue de l'instance (j'.e, PAS à l'intérieur de mon modal composant):

methods: {
    showModal(name) { this.bus.$emit('showModal'); },
}

Ce que je veux faire est d'accéder à la propriété name de la composante-quelque chose comme ceci:

created() {
    this.bus.$on('showModal', () => alert(this.name));
}

Mais cela apparaît comme undefined.

Donc ce que je fais mal? Comment puis-je accéder à la propriété name à l'intérieur de la composante modale?

REMARQUE: Si vous vous demandez ce que cela.bus.$sur l'est, veuillez voir la réponse suivante à la question précédente que j'ai demandé: https://stackoverflow.com/a/42983494/7477670

OriginalL'auteur Moshe | 2017-03-23

  1. 25

    Passer en tant que paramètre à $emit.

    methods: {
    showModal(name) { this.bus.$emit('showModal', name); },
}

created() {
    this.bus.$on('showModal', (name) => alert(name));
}

    Aussi, si vous voulez donner la modale d'un nom, vous devez l'accepter comme un accessoire en modal composant.

    Vue.component("modal",{
    props:["name"],
    ...
})

    Alors je suppose que vous voulez faire quelque chose comme, 

    if (name == this.name)
    //show the modal

    OriginalL'auteur Bert