设置table列的样式


最终实现效果:
在这里插入图片描述

第一步:需要在columns中,给需要单独设置样式的列加一个className属性。

{
		  title: '剩余时间',
		  dataIndex: 'TXSJ',
		  key: 'TXSJ',
		  className: 'datestyle',  
		  width: 60,
		  ellipsis: true,
		  sorter: (a, b) => {
			  let aTime = new Date(a.TXSJ).getTime();
			  let bTime = new Date(b.TXSJ).getTime();
			  return aTime - bTime;
		  },
		  sortOrder: sortedInfo.columnKey === 'TXSJ' && sortedInfo.order,
},

在这里插入图片描述
第二步:在css文件中定义样式。

.datestyle{
	background: #ff0000;
	color: #000000;
	font-weight: bolder;
}

通过以上两步,就可以完美实现table中单独设置列样式了。

Logo

前往低代码交流专区

更多推荐