vue在v-html中绑定事件
需求:后台给的一部分数据需要绑定事件,然后根据需要绑定查看详情事件。数据结构:{"addr":"1095b308dbcb8ad4791d56028b7f5731c7e655c7","balance":"{\"thisistest7\":94999900}","nonce":4,&
·
需求:后台给的一部分数据需要绑定事件,然后根据需要绑定查看详情事件。
数据结构:
{
"addr":"1095b308dbcb8ad4791d56028b7f5731c7e655c7",
"balance":"{\"thisistest7\":94999900}",
"nonce":4,
"isToken":true
}
由于balance是个字符串,需要点击后查看详情,必须渲染成html,但是渲染后的html里面写绑定事件的代码没有经过vue编译,所以事件无效。
解决办法:在v-html同级元素中使用事件绑定,然后根据事件处罚的目标对象去获取参数。
<td v-html="item.balance" @click="tokenDetail($event)">{{item.balance}}</td>
渲染内容:
<a href="javascript:;" data-key="key">key : value</a><br>
事件详情:
tokenDetail: function(e){
if(e.target.nodeName === 'A'){
// 获取触发事件对象的属性
var token = e.target.getAttribute('data-key');
layer.open({
type: 2,
title: '详情',
area: ['800px','500px'],
shade: [0],
content: ['token_detail.html?token='+ token],
shadeClose: true
})
}
},
更多推荐
已为社区贡献2条内容
所有评论(0)