鍍金池/ 問答/HTML/ antd 中table的列 如果按需給className?

antd 中table的列 如果按需給className?

比如 消息未讀就給'red_color',已讀就給'blue_color'

columns是

info_columns: [
    {title: '標題',dataIndex: 'info_title'},
    {title: '消息內(nèi)容',dataIndex: 'info_content'},
    {title: '時間',dataIndex: 'info_time'},
    {
        title: '類型',
        dataIndex: 'info_type', 
        filters: [
            {text: '消息',value: '1',}, 
            {text: '信息',value: '2',}, 
            {text: '短信',value: '3',}, 
            {text: '狀態(tài)',value: '4',}, 
            {text: '工作',value: '5',}
        ]
    }
]

我想根據(jù)info_state(已讀1,未讀0),給 {title: '標題',dataIndex: 'info_title'},列 加一個className
屬性。

總的一句話 antd table 如何 給同一列不同行 添加不同的className?

回答
編輯回答
墨沫

info_columns: [

{
    title: '標題',
    dataIndex: 'info_title',
    render: (text, record) => <span className={record.info_state == 1? "OK" : 'error'}>{text}</span>
},
{title: '消息內(nèi)容',dataIndex: 'info_content'},
{title: '時間',dataIndex: 'info_time'},
{
    title: '類型',
    dataIndex: 'info_type', 
    filters: [
        {text: '消息',value: '1',}, 
        {text: '信息',value: '2',}, 
        {text: '短信',value: '3',}, 
        {text: '狀態(tài)',value: '4',}, 
        {text: '工作',value: '5',}
    ]
}

]

這個三目運算的判斷根據(jù)你的info_state的數(shù)據(jù)類型來判斷

2018年6月2日 11:27