学堂 学堂 学堂公众号手机端

Vue中动态拼接innerHTML时添加点击click事件,并调用vue方法

lewis 1年前 (2024-03-26) 阅读数 7 #技术

代码如下,通过在innerHtml添加onclick='windowAddClickTag(1)'方法

          let content = document.createElement('div')
            content.innerHTML = 
            `<div onclick='windowAddClickTag(1)'>
            <p style='background:#0849B4;border: 2px solid #FFFFFF; padding: 0 13px; width: 120px;color: #FFFFFF;text-align: center;line-height: 48px;'>自定义标签</p>
            <img src="${icon}" style='width: 40px; height: 40px; margin: 0 40px;'"/>
            </div>`

并且在mounted添加该方法
    mounted() {
        window.windowAddClickTag = data => {
          this.handleClickTag(data)
        }
      },
就可以调用了
methods: {
        handleClickTag(data){
            console.log(data)
        },
   } 
版权声明

本文仅代表作者观点,不代表博信信息网立场。

热门