vue html绑定点击事件,vue实现在v-html的html字符串中使用v-model

1. 绑定点击事件

在Vue中，可以使用`v-on:click`或`@click`来绑定点击事件。

例如，在一个按钮上绑定一个点击事件：

<button @click="handleClick">点击我</button>

在Vue实例中定义`handleClick`方法：

methods: {
  handleClick() {
    // 处理点击事件
  }
}

2. 在v-html的html字符串中使用v-model

在Vue中，可以使用`v-model`来实现双向数据绑定。但是，`v-model`只能用于表单元素，比如`<input>`、`<select>`和`<textarea>`等。

如果想在`v-html`的html字符串中使用`v-model`，可以使用自定义指令来实现。

例如，在Vue实例中定义一个自定义指令：

Vue.directive('model', {
  bind: function(el, binding, vnode) {
    el.addEventListener('input', function(event) {
      vnode.context[binding.expression] = event.target.innerHTML;
    });
  }
});

在html字符串中，使用自定义指令`v-model`：

<div v-html="'<p contenteditable v-model=\'content\'></p>'"></div>

在Vue实例中，定义`content`属性：

data: {
  content: ''
}

这样，就可以在`<p>`标签中使用`v-model`实现双向数据绑定了。