vue 在 v-html 元素中绑定事件

11 min read

原理: 使用事件代理

<div class="code-review">
   <div v-html="html" v-highlight @click="htmlClick($event)"></div>
</div>
 
 
computed: {
    html () {
      return '<button></button >'
    },
  },

在v-html同级元素中使用事件绑定,然后根据事件触发的目标对象去判断和获取参数。

htmlClick(event) {
  if(event.target.nodeName === 'img'){
	// 获取触发事件对象的属性
	alert("a");
  }
},