小编给大家分享一下vue如何实现在v-html的html字符串中绑定事件,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
网站建设公司,为您提供网站建设,网站制作,网页设计及定制网站建设服务,专注于企业网站设计,高端网页制作,对玻璃钢坐凳等多个行业拥有丰富的网站建设经验的网站建设公司。专业网站设计,网站优化推广哪家好,专业营销推广优化,H5建站,响应式网站。
需求:
需要在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"); } },
以上是“vue如何实现在v-html的html字符串中绑定事件”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!
网站标题:vue如何实现在v-html的html字符串中绑定事件
链接分享:https://www.cdcxhl.com/article6/ieedog.html
成都网站建设公司_创新互联,为您提供网站建设、静态网站、网站内链、全网营销推广、网站策划、App设计
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联