VUE解决v-html不能触发点击事件的问题 背景:后端返前端html格式的数据,前端⽤v-html解析渲染,如:<a @click="show(1)"></a>,a标签能成功渲染,但其绑定的事件⽆法触发。原因:vue没有将其作为vue的模板解析渲染 解决⽅案:不⽤v-html⽽是component模板编译 上⼲货:<template> <div class="...
}, methods: {//触发v-html中的点击事件triggerClick(event) { console.log("获取标签名="+event.target.className)//获取标签名console.log("获取class属性名="+event.target.nodeName)//获取class属性名console.log("获取id值="+event.target.id)//获取id值} } };</script> 实测有效...
1、要嵌入到vue代码中的部分html代码 双击图片会调用imgDbClick方法,此方法为html里面的方法。<img ondb...
Vue 使用v-html 动态加载代码 点击事件失效 使用vue+ztree展示地区时发现,拼接代码地区后显示新增、修改操作,click事件无效 两种解决方案: 1、事件绑定到window 2、手动添加点击事件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 addHoverDom:fu...
然而,当使用v-html时,Vue会跳过模板编译步骤,直接将HTML字符串插入到DOM中。因此,v-html内容中的Vue指令不会被解析,自然也就无法绑定点击事件。 3. 解决方案:使用事件委托 为了在v-html内容中添加点击事件,可以使用事件委托的方式。事件委托是一种将事件监听器绑定到父元素上,并通过事件冒泡机制来处理子元素事件...
vue 通过v-html 渲染出一段富文本,富文本中包含一些@click事件,但是渲染出来的@click事件没办法触发,只作为字符串解析出来 <template> <div class="editecontent"> <p>{{editeText}}</p> <div class="editeshow"> <draggable v-model="editlist" class="draggshow" :options="{group:'people'}"> <...
亲,你没有绑定点击事件在<el-row id="doubtImg" class="commonRow" v-html="OCRModel.OCR_IMGTYP023_Div">这个上面!<el-row id="doubtImg" class="commonRow" v-html="OCRModel.OCR_IMGTYP023_Div">这段话改成<el-row id="doubtImg" class="commonRow" v-html="OCRModel.OCR_IMG...
通过点击button触发函数fn;vue直接操作data的数据,不是操作dom。 2.@:click="函数名字"是v-on:click的简写模式,效果和用法是一样的; 3.我们像下边这么调用也是可以的,只是唯一的却别在于是否有参数需要传入下边的方式并不能传入参数;区别在于v-on后边的函数名字后没有参数 ...
可以用事件代理,在<div @click="maopao(event)" v-html="xxxx">。在maopao事件里判断元素类型。