Vue innerHtml click事件

vue项目中使用G6作为展示拓扑图的库
在使用tooltip时，想在tooltip中添加点击事件，由于tooltip返回内容使用的是innerHtml，所以methods中的方法不能直接引用

解决方法如下：
标签中使用click事件，使用模板函数传参

//事件
getContent: e => {const outDiv = document.createElement('div')outDiv.style.width = 'fit-content'outDiv.innerHTML =`<a οnclick="handleOption(${true})">${i18nRender('start')}</a><br><a οnclick="handleOption(${false})">${i18nRender('stop')}</a>`return outDiv}

在mounted中定义全局函数handleOption

mounted () {const _this = thiswindow.handleOption = function (flag, serverType, name) {if (flag) {startServer().then(res => {_this.reload()})} else {stopServer().then(res => {_this.reload()})}}
}

即可解决问题

innerHtml click事件相关推荐

踩坑 - click事件与blur事件冲突问题 input文件上传同名文件问题
前言上周写需求遇到了一点小坑涉及到一些小细节,今天赶上没啥事总结一下分享出来. click事件与blur事件冲突问题 click事件与blur事件 blur事件: 表单事件,元素失去焦点时候触发,不 ...
不同dom的blur事件和click事件发生冲突
直接上测试代码 <!DOCTYPE html> <html lang="en"> <head><title>不同dom的blur事件 ...
前端click事件及自定义事件
响应式页面开发常见的前端响应式开发有3套相应的解决方案: bootstrap 的 columns 布局 : 2. 使用全局的rem (页面所有元素的宽高和字体都用rem等比缩放) 使用阿里的flex ...
blur事件与click事件冲突的解决办法
问题当对节点同时添加 blur事件以及 click事件,触发 click事件的时候程序报出这样的一个错误(Chrome浏览器): Uncaught NotFoundError: Failed t ...
html innerhtml 绑定事件无效,innerHTML 中添加onclick步骤不管用
innerHTML 中添加onclick方法不管用 div.style.height = "200px"; div.style.cursor = "pointer&qu ...
《H5 App开发》移动端IOS click 事件响应缓慢的解决方案
造成点击缓慢的原因从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间.为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作. 第一 ...
关于javascript:void(0);，herf=”#”以及在IE6下，click事件失效的问题
经常看到一些网页中,超链接标签中<a href="#"> herf中的"#"改成javascript:void(0);因为#包含了一个位置信息,默认 ...
解决Titanium Tab组件click事件在iOS中不生效的方案
2019独角兽企业重金招聘Python工程师标准>>> 问题: 以下代码,tab1的click事件在Android中生效,在iOS不生效 1: function Applicatio ...
fastclick：处理移动端click事件300毫秒延迟
fastclick:处理移动端click事件300毫秒延迟 1.兼容性 iOS 3及更高版本的移动Safari iOS 5及更高版本的Chrome Android上的Chrome(ICS) Opera ...

innerHtml click事件

Vue innerHtml click事件

innerHtml click事件相关推荐

最新文章

热门文章