Vue で $emit を使用する場合、親コンポーネントが子コンポーネントのイベントをリッスンしないようにするにはどうすればよいですか?

以下に、Vue が $emit を使用する場合、親コンポーネントが子コンポーネントのイベント インスタンスを監視できないことについての記事を共有します。これは良い参考値であり、皆様のお役に立てば幸いです。

vue が $emit を使用する場合、親コンポーネントが子コンポーネントのイベントを監視できない理由は、$emit によって渡されるイベント名が小文字のみであり、大文字のキャメルケース規則を使用して名前を付けることができないためです

<p id="counter-event-example">
  <p>{{ total }}</p>
  <button-counter v-on:ee="incrementTotal"></button-counter>
  <button-counter v-on:eEvent="incrementTotal"></button-counter>
  <child ref="cmpSelect" v-on:ee="incrementTotal" option-api-url="/api/admin/cms/cmsCategory/getOptions.do"></child>
 </p>
 <script>
  Vue.component(&#39;button-counter&#39;, {
   template: &#39;<button v-on:click="increment">{{ counter }}</button>&#39;,
   data: function () {
    return {
     counter: 0
    }
   },
   methods: {
    increment: function () {
     this.counter += 1
     this.$emit(&#39;ee&#39;, this.counter);//有效
     this.$emit(&#39;eEvent&#39;, this.counter);//无效，不能使用大写的驼峰规则命名
    }
   },
  })
  new Vue({
   el: &#39;#counter-event-example&#39;,
   data: {
    total: &#39;点击下面的按钮&#39;
   },
   methods: {
    incrementTotal: function (b) {
     this.total = b;
    }
   }
  })
 </script>

上記は私がまとめたものです。今後の皆様のお役に立てれば幸いです。

関連記事:

jQuery+JSONPによるクロスドメインリクエストメソッド(詳細チュートリアル)

Vueでのメソッドと計算の違いを詳しく説明する(詳細チュートリアル)

Vue2を使用。 0にhttpリクエストと読み込み表示を実装

以上がVue で $emit を使用する場合、親コンポーネントが子コンポーネントのイベントをリッスンしないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。