您的位置:首页 > Web前端 > Vue.js

ant design of vue的table点击行变色

2020-04-21 19:45 751 查看

ant design of vue的table点击行变色

功能:实现点击行变色
扩展:更多功能可以在函数里面进行添加

代码:

table中:

:customRow="customRowThing"

methods中:

customRowThing(record){
return {
on:{
click:(e)=>{
let oldList = document.querySelectorAll(".checked-td-of-add-table")
if(oldList){
for (let j = 0; j < oldList.length; j++) {
oldList[j].classList.remove("checked-td-of-add-table")
}
}

let children = e.target.parentNode.children
for (let i = 0; i < children.length; i++) {
children[i].classList.add("checked-td-of-add-table")
}
},
}
}
},
/deep/ .checked-td-of-add-table {
background-color: rgba(24,144,255,0.5);
}
  • 点赞
  • 收藏
  • 分享
  • 文章举报
qq_40165432 发布了3 篇原创文章 · 获赞 0 · 访问量 121 私信 关注
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: