项目中的一个需求,让表格内的金额数据靠右展示,其余都居中显示,那么表头肯定不能一块居右,因为其他表头都是居中的,偶尔一个居右影响美观。
刚开始设想的很好,所有表头统一设置的居中显示,那么表体单独设置居右就可以了
const columns = [
{
className: "columnHead", //columnHead里面设置了居中的样式
title: "预计费用",
dataIndex: "yjfy",
width: TableWidth.W70, //70
render:(value,row)=><span style={{textAlign:'right'}}>{value ? value.toFixed(2):''}</span>
},
]
如上代码,开始用了span标签,但由于span标签是行内元素,设置居中样式并不生效,后来改用p标签就生效了,p标签会自动占据整个td的宽度
const columns = [
{
className: "columnHead", //columnHead里面设置了居中的样式
title: "预计费用",
dataIndex: "yjfy",
width: TableWidth.W70, //70
render:(value,row)=><p style={{textAlign:'right'}}>{value ? value.toFixed(2):''}</p>
},
]