antd中的table，如何根据单元格数据不同显示不同的背景色

Question

求大佬详细解释，看过其他人的回答，还是不太清楚怎么设置的样式

Answer 1

用css就可以了

.ant-table-tbody tr:nth-child(2n) {
    background-color: grey;
}

单元格可以用jsx：

{
  title: '编号',
  dataIndex: 'orderNo',
  align: 'center',
  render: val => <span className="red-style">{val}</span>,
}

或者onCell：

{
  title: '编号',
  dataIndex: 'orderNo',
  onCell: (record, rowIndex) => ({
    style: {
      backgroundColor: 'red'
    }
  })
}

Answer 2

这个在cloumn里可以设置的,通过返回render方式来自定义单元格的样式

Answer 3

render: (text, record) => {
if(record.条件===条件值){

return (
  text > 25000 ?
    (
      <span style={{ color: 'red' }}>{text}</span>
    ) : (  text <= 0 ?
    (
      <span style={{ color: 'yellow' }}>{text}</span>
    ) : <span>{text}</span>)
);

}

其他条件在加if写下去就可以了