写项目过程中，遇到一样一个需求： 看了官方文档的用法，customRow好用，customCell怎么都不好用，后来找了好久，才找到解决办法。

customRow 用法 customCell 用法

首先在html中引入，把customCell绑定自己自定义的一个方法cellStyle。

:dataSource="dataSource" :pagination="ipagination" :loading="loading" :customCell="cellStyle"

:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" class="j-table-force-nowrap"

@change="handleTableChange">

在columns中需要的那一列定义customCell

const columns = [

...

{

title: '时间(s)',

dataIndex: 'time',

key:'time',

align: "center",

width: 100,

customCell:this.cellStyle

},

...

]

在methods中定义cellStyle()方法

methods: {

// 判断日期并加背景色

// 单元格样式函数

cellStyle(row, column) {

// console.log("单元格样式函数" + JSON.stringify(row), column)

var cell = JSON.stringify(row)

var date = new Date()

var year = date.getFullYear();

var month = date.getMonth() + 1;

var day = date.getDate();

month = (month > 9) ? month : ('0' + month);

day = (day < 10) ? ('0' + day) : day;

var today = year + '-' + month + '-' + day;

console.log("单元格样式函数" + row.nextAssessDate, today)

if (row.nextAssessDate < today) {

return {

style: {

'background-color': 'red',

}

}

}

},

最后实现的效果，不符合条件的被标红

文章链接

评论可见，请评论后查看内容，谢谢！！！评论后请刷新页面。