Vue で親コンポーネントを使用して子コンポーネント イベントを呼び出す方法

ここで、Vue の親コンポーネントが子コンポーネントのイベント メソッドを呼び出す方法についての記事を共有します。この記事は参考になるので、皆さんのお役に立てれば幸いです。

Vue 親コンポーネントは子コンポーネントにイベントを渡したり、イベントを呼び出したりします

データ (小道具) を渡すのではなく、Vue 2.0 に適しています

方法 1: 子コンポーネントは、によって送信されたメソッドをリッスンします親コンポーネント

方法 2: 親コンポーネントが子コンポーネントのメソッド

を呼び出す 子コンポーネント:

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

親コンポーネント:

<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
  }
}

上記はコンパイルしました将来すべての人にとって役立つことを願っています。

関連記事:

Vueでコンポーネントを作成する方法

jQueryでliタグを動的に追加し、属性を追加し、イベントメソッドをバインドする方法

elementuiでデフォルトのスタイル変更を実装する方法

以上がVue で親コンポーネントを使用して子コンポーネント イベントを呼び出す方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。