vue.js がイベントをトリガーできない場合はどうすればよいですか?

vue はイベントを解析せず、vue テンプレートとしてレンダリングしないため、vue.js はイベントをトリガーできません。解決策は、v-html を使用するのではなく、コンポーネント テンプレートを通じてフロントエンド データをコンパイルしてレンダリングすることです。 。

#このチュートリアルの動作環境: Windows7 システム、vue3 バージョン、DELL G3 コンピューター。

vue.js v-html はクリック イベントをトリガーできませんか?

バックグラウンド:

バックエンドはデータを html 形式でフロントエンドに返し、フロントエンドは v-html を使用して解析およびレンダリングします。たとえば、 の場合、a タグは正常にレンダリングできますが、それにバインドされたイベントをトリガーできません。

原因:

vue は解析せず、vue テンプレートとしてレンダリングしません

解決策:

v-html は使用せず、コンポーネント テンプレートのコンパイルを使用します。

オンライン情報:

<template>
 <div class="hello">
  <h1>
   我是父组件
  </h1>
  <div class="parent" id="parent">
  </div>
 </div>
</template>
 
<script>
 import Vue from &#39;vue&#39;;
 var MyComponent = Vue.extend({
  template: &#39;<a @click="show(1)">我是大魔王</a>&#39;,
   methods: {  
   show(i) {
    console.log(i);
   },
  }
 });
 var component = new MyComponent().$mount();
 export default {
  data() {
   return {
   }
  },
  methods: {
  },
  mounted() {
   document.getElementById(&#39;parent&#39;).appendChild(component.$el);
  }
 }
</script>
 
<style scoped>
</style>

ページ:

コンソール:

【おすすめ関連記事：

vue.js】

以上がvue.js がイベントをトリガーできない場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。