Comment utiliser le composant parent pour appeler des événements de composant enfant dans Vue

Je vais maintenant partager avec vous un article sur la façon dont un composant parent Vue appelle une méthode d'événement de composant enfant. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

Le composant parent Vue transmet les événements/appels aux composants enfants

Il ne transmet pas de données (accessoires), il est applicable à Vue 2.0

Méthode 1 : Le composant enfant écoute la méthode envoyée par le composant parent

Méthode 2 : Le composant parent appelle la méthode du composant enfant

Composant enfant :

export default {
  mounted: function () {
   this.$nextTick(function () {
    this.$on('childMethod', function () {
     console.log('监听成功')
    })
   })
  }，
  methods {
    callMethod () {
     console.log('调用成功')
    }
  }
}

Composant parent :

<child ref="child" @click="click"></child>

export default {
  methods: {
   click () {
   this.$refs.child.$emit(&#39;childMethod&#39;) // 方法1
   this.$refs.child.callMethod() // 方法2
  },
  components: {
   child: child
  }
}

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

Articles connexes :

Comment créer des composants dans Vue

Comment ajouter dynamiquement des balises li et ajouter des attributs et des liaisons dans jQuery Defined méthode d'événement

Comment implémenter la modification de style par défaut dans elementui

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!