jquery删除表格的当前行怎么修改layui表格中某单元格的内容和背景色？

来源：蜘蛛抓取(WebSpider) 时间：2023-12-19 11:17 标签： jquery删除表格的当前行
先看效果图：根据某项属性确定高亮哪一列或几列的单元格。根据elemenUI中 table组件的可修改属性来配置 cell-style
<el-table
ref="multipleTable"
:data="tableData"
v-loading="loading"
:cell-style="abnormal_columnStyle"
:header-cell-style="{'padding':'0 5px', 'text-align': 'center' }"
tooltip-effect="dark"
style="width: 100%"
>
<el-table-column prop="abnormal_type" label="异常类型" min-width="120">
<template slot-scope="scope">
<span :style="abnormal_typeText(scope.row.abnormal_type).style">● </span>
{{ abnormal_typeText(scope.row.abnormal_type).text }}
</template>
</el-table-column>
<el-table-column prop="check_count" label="次数" min-width="60">
</el-table-column>
<el-table-column prop="region" label="省份" width="">
</el-table-column>
<el-table-column prop="city" label="城市" width="">
</el-table-column>
<el-table-column prop="nickname" label="用户" width="">
</el-table-column>
</el-table>
把回调的函数写在computed，利用缓存
abnormal_columnStyle() {
return function(row, column, rowIndex, columnIndex) {
const style = {
times: {
'backgroundColor':'#ff5b5b','text-align':'center','font-weight':'bold','color':'#fff'},
person: {'backgroundColor':'#db639b','text-align':'center','font-weight':'bold','color':'#fff'},
area: {'backgroundColor':'#ea9b17','text-align':'center','font-weight':'bold','color':'#fff'},
all: {'text-align':'center',},
}
if (row.column.property == 'nickname') {
if (row.row.abnormal_type == 'person') {
return style[row.row.abnormal_type]
}else{
return style['all']
}
} else if (row.column.property == 'region'
row.column.property == 'city') {
if (row.row.abnormal_type == 'area') {
return style[row.row.abnormal_type]
}else{
return style['all']
}
}else if (row.column.property == 'check_count') {
if (row.row.abnormal_type == 'times') {
return style[row.row.abnormal_type]
}else{
return style['all']
}
}else{
return style['all']
}
}
},

我要回帖

更多关于 jquery删除表格的当前行 的文章

 

随机推荐