vue-插入字符串html代码如何绑定事件平民写法

本人应用场景: 从一大串字符串中识别出所有图片链接并替换成 img 标签, 替换代码如下图:

注意图中 class=”csreplyFAQ”, 过会要用到 (由于我这里需要遍历出来, 又懒不想用动态 id, 所以用了 class, 实际操作建议用 id).

确定字符串类型 html 已经插入页面

下面要写一个方法, 将 a 标签绑定上事件, 直接上代码吧, 并不难理解

reBindImgs(){this.$nextTick(()=>{let dom=document.getElementsByClassName('csreplyFAQ')
    if(dom.length){let arrDom=Array.from(new Set(dom))
      arrDom.forEach(element => {element.addEventListener('click',this.showImgList)
      });
    }
  })
},

此方法需要在插入 html 片段后执行.
需要注意的是 addEventListener 方法内第二个参数是函数, 可以在参数直接写一个方法; 也可以调用 Vue methods 内的方法, 但是调用的方法不能传参数, 默认参数是 MouseEvent.