react+antd 自定义table单元格属性

先把antd table的基本样式引入,在columns中需要设置单元格属性的列描述数据对象中加入onCell属性,引入css样式

import styles from './xxx.less';
columns = [
    {
        title: '..',
        ....
         onCell(record, rowIndex) {;
            return {
                className: styles[`.....`],
            };
        },

    },
    ....
    ]
    
    <Table
	columns={this.columns}
	....
	/>

在xx.less中,设置css样式,但是在样式的后面需要加上 !important 来提高指定样式规则的应用优先权,语法格式{ cssRule !important },即写在定义的最后面,例如:box{color:red !important;}。在CSS中,通过对某一样式声明! important ,可以更改默认的CSS样式优先级规则,使该条样式属性声明具有最高优先级。使用了!important,所以有优先级最高,会覆盖掉antd本身自带的css样式。

.a {
	color: #ff9900!important;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值