vue实现在v-html的html字符串中绑定事件

作者:sayok_why 时间:2023-07-02 16:44:08 

需求:

需要在v-html的html字符串的button中绑定点击事件,需要点击后做一些操作,必须渲染成html,但是渲染后的html里面写绑定事件的代码没有经过vue编译,所以事件无效。


<div class="code-review">
 <div v-html="html" v-highlight @click="addComment($event)"></div>
</div>

computed: {
 html () {
  return '<button></button >'
 },
},

解决办法:

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


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

来源:https://blog.csdn.net/sayoko06/article/details/86737467

标签:vue,v-html,html,字符串,绑定事件
0
投稿

猜你喜欢

  • php 备份数据库代码(生成word,excel,json,xml,sql)

    2024-06-05 09:52:42
  • golang 将[]byte转成16进制的实现

    2024-02-17 00:35:03
  • pytorch 数据处理:定义自己的数据集合实例

    2021-09-11 06:10:21
  • Python figure参数及subplot子图绘制代码

    2023-09-14 17:13:00
  • 你知道怎么在淘宝里进行投诉吗?

    2008-06-04 12:00:00
  • MySQL中处理各种重复的一些方法

    2024-01-12 17:45:14
  • Go语言变量与基础数据类型详情

    2023-08-30 03:13:16
  • Active Server Pages 错误 ASP 0201 修复方法

    2011-03-06 10:41:00
  • java正则表达式解析html示例分享

    2023-06-13 15:53:42
  • Python绘图示例程序中的几个语法糖果你知道吗

    2021-01-18 17:15:25
  • CSS Hack 汇总快查

    2007-11-06 11:48:00
  • 解析Vue2.0双向绑定实现原理

    2024-06-05 15:29:32
  • python利用JMeter测试Tornado的多线程

    2022-10-15 12:03:26
  • Javascript技术栈中的四种依赖注入小结

    2024-04-18 10:54:08
  • 自己用python做的一款超炫酷音乐播放器

    2021-05-26 04:47:35
  • python进阶教程之文本文件的读取和写入

    2023-08-03 03:27:47
  • Python+selenium实现截图图片并保存截取的图片

    2023-06-03 10:15:59
  • Python实现的matplotlib动画演示之细胞自动机

    2022-05-23 15:49:09
  • python实现人脸签到系统

    2023-12-21 06:35:05
  • python实战项目scrapy管道学习爬取在行高手数据

    2021-03-19 01:27:19
  • asp之家 网络编程 m.aspxhome.com