记录Ant-Vue-table中customCell改变单元格样式

写项目过程中，遇到一样一个需求：

看了官方文档的用法，customRow好用，customCell怎么都不好用，后来找了好久，才找到解决办法。

customRow 用法

customCell 用法

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

 <a-table ref="table" size="middle" :scroll="{ x: true }" bordered rowKey="id" :columns="columns"
        :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',
          }
        }
      }
    },

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