Layer动态设置每一行的背景色
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script>
table.render({
elem: '#table_id' //表格ID
,url: '/.../.../...' //请求数据地址
,where: {type : '1', name: 'hello'}//默认传参,可不设置
,cols: [[ //列字段设置
,{field: 'hobby', width:'30%', title: '爱好'}
,{field: 'create_time', title: '时间'}
...
]]
,text: {
none: '暂无相关数据!' //没有数据默认展示内容
}
,page: false //是否开启分页
,parseData: function(res) {//数据显示
return {
code: res.code,
msg: res.msg,
count: res.count,
data: res.data
}
}
,done(res, curr, count){
let data = res.data;
data.forEach((value, i) => {
let index = data[i]['LAY_TABLE_INDEX'];
//根据每一行的status字段,设置当前行的背景颜色
if (value.status == 1 ) {
$('.layui-table tr[data-index="' + index + '"]').css({ 'background-color': '#FFFFFF' });
} else if ( value.status == 2 ) {
$('.layui-table tr[data-index="' + index + '"]').css({ 'background-color': 'blue' });
} else{
$('.layui-table tr[data-index="' + index + '"]').css({ 'background-color': '#' });
}
});
}
});
</script>
</html>