Skip to content
ページの内容

v-on.native 修飾子の削除
破壊的変更

概要

v-on.native 修飾子は削除されました。

2.x の構文

v-on でコンポーネントに渡されたイベントリスナーは、デフォルトでは this.$emit でイベントを発行したときにのみトリガーされます。代わりに子コンポーネントのルート要素にネイティブな DOM リスナーを追加するには、.native 修飾子を使用できます:

html
<my-component
  v-on:close="handleComponentEvent"
  v-on:click.native="handleNativeClickEvent"
/>

3.x の構文

v-on.native 修飾子は削除されました。同時に、新しい emits オプションによって、子が実際に発行するイベントを定義できるようになりました。

その結果、Vue は、子要素でコンポーネント発信イベントとして定義されていないすべてのイベントリスナーを、子要素のルート要素のネイティブイベントリスナーとして追加するようになりました(子要素のオプションで inheritAttrs: false が設定されている場合を除く)。

html
<my-component
  v-on:close="handleComponentEvent"
  v-on:click="handleNativeClickEvent"
/>

MyComponent.vue

html
<script>
  export default {
    emits: ['close']
  }
</script>

移行手順

  • .native 修飾子のインスタンスをすべて削除します。
  • すべてのコンポーネントで emits オプションを使用して、イベントをドキュメント化するようにします。

移行ビルドのフラグ: COMPILER_V_ON_NATIVE

参照