Vue中怎样为通过字符串渲染进dom的标签添加事件

既然你是通过dom添加，那就用dom绑定就是了

document.getElementById('table').innerHTML = strdocument.getElementById('qwe').onclick = function(){console.log(1)

}

在vue，react中，讲的就是虚拟dom，就是尽量避免 *** 作dom，所以这样写的思想是错的，你应该去利用数据来渲染

template:

<table id="table">

<tr v-for="(item,i) in tableData" :key='i'>

<td v-for="(item2,j) in item" :key='j' @click='handleClick'>{{item2.title}}</td>

</tr>

</table>

data:

tableData:[]

methods:btn(){

this.tableData = [[{title:'qwe'}]]

}

<template>

<el-form :model="formData" :rules="formRules" ref="form">

<el-form-item v-for="(item, index) in formConfig" :label="item.label" :key="index">

<template v-if="item.type === 'input'">

<el-input v-model="formData[item.field]" :placeholder="item.placeholder" @input="handleInput(item.field)" />

</template>

<template v-else-if="item.type === 'select'">

<el-select v-model="formData[item.field]" placeholder="请选择" @change="handleSelect(item.field)">

<el-option v-for="option in item.options" :key="option.value" :label="option.label" :value="option.value" />

</el-select>

</template>

<!-- 其他表单元素类型 -->

</el-form-item>

</el-form>

</template>

<script>

export default {

data() {

return {

formConfig: [], // 表单数据结构

formData: {}, // 表单数据

formRules: {} // 表单验证规则

}

},

methods: {

handleInput(field) {

// 处理输入框 input 事件

},

handleSelect(field) {

// 处理下拉框 change 事件

}

// 其他事件处理函数

}

}

</script>

updated(){

    // 点击内容中参考文献右侧参考文献加粗

    this.$nextTick(function () {

      // 页面渲染完成之后

      $("#XMLContent sup a[type='reference']").click(function(e){

        e.stopPropagation()

        let subId = $(this).attr('id')

        $('.note-list li a').each(function(){

          if($(this).hasClass(subId)){

            $(this).addClass('subfont').siblings().removeClass('subfont')

          }else{

            $(this).removeClass('subfont')

          }

        })

      })

    })

  },

---