How to dynamic change text color based on text value ?

[leileili]

Hello , I'm building a table with values which might have negative value in the cells. How do I change the text color to red if the cell value is negative, black if it's positive?

Thanks.

[leileili]

        <BootstrapTable data={bodyData} options={this.options} hover bordered={false} trStyle={this.cellClassNameFormat(bodyData)}>

and in the cellClassNameFormat function, I put: cellClassNameFormat(data){ data.map( (itemData,index)=>{ let keys = Object.keys(itemData); keys.map( (item,idx) =>{ let cellItem = itemData[item]; if(typeof cellItem==="number"){ return{ color: cellItem <0 ? 'red' : 'black' } } }) }) }

but it doesn't work.

[leileili]

I've figured it out: use tdStyle to change the color works.

{headerObj.detail[item]}{'\u21c5'}

columnStyleFormat(fieldValue, row, rowIdx, colIdx){ if(typeof fieldValue==="number"){ return { color: fieldValue<0 ? 'red' : 'black' } }else { return { color: 'black' } }

}