elementui点击table每一行会变色,当有固定列的时候,

时间:2020-9-6 作者:admin

1. html代码
@row-click=”rowClick”

:row-class-name=”tableRowClassName”

:row-style=”selectedHighlight”

2. js代码

// 解决当表格有固定列,点击,鼠标悬浮的时候行会变色的问题

tableRowClassName({ row, rowIndex }) {

//把每一行的索引放进row

row.index = rowIndex;

},

// 解决当表格有固定列,点击,鼠标悬浮的时候行会变色的问题

selectedHighlight({ row, rowIndex }) {

if (this.getIndex === rowIndex) {

return {

‘background-color’: ‘#ffeecf !important’

};

}

if(rowIndex % 2 == 0){

return {

‘background-color’: ‘#F9F9F9’

}

}

},

// 解决当表格有固定列,点击,鼠标悬浮的时候行会变色的问题

rowClick(row) {

this.getIndex = row.index;

},

3. css代码
/ 当table有fixed固定列的时候,鼠标悬浮一样会变色 /

.el-table__body .el-table__row.hover-row td {

background-color: #FFF9EE !important;

}

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。