vue 中拼接html时添加点击事件
在vue 的html拼接在添加点击事件用原生的onclick来触发事件,将事件挂在window上html模板<template><div class="layout1"><div class="layout" id="layout"></div></div></template><script>import $ f
·
在vue 的html拼接在添加点击事件用原生的onclick来触发事件,将事件挂在window上
html模板
<template>
<div class="layout1">
<div class="layout" id="layout">
</div>
</div>
</template>
<script>
import $ from 'jquery'
export default {
mounted () {
this.getData();
},
methods: {
getData(){
var html = "";
let id = [1,2,3],name = ['小A','小B','小C'];
for (var i = 0; i < 3; i++) {
html += '<el-button onclick="get_info('+id[i]+',\''+name[i]+'\')" >'+ name[i] + '</el-button>';
}
$(".layout").append(html)
window.get_info = function(id,name) {
console.log(id)
console.log(name)
}
}
}
}
</script>
结果:
点击小A,取到了值
总结:vue拼接html点击事件使用onclick事件。
1.不带参数 onclick = “get_info()”
2.带参数onclick = “get_info(’+id[i]+’)”
3.如果参数是字符串,需要用转义字符 onclick = “get_info(’’+name[i]+’’)”
更多推荐
已为社区贡献6条内容
所有评论(0)