vue a-table 标题居中,内容左对齐
column中的align:left 属性虽然可以设置对齐方式,但会使得内容和标题一起改变。解决方案:1.column中不使用框架默认align,使用customRender()设置内容对齐方式columns: [{title: '标题',// align:"left",dataIndex: 'title',//(本列的值,所有行数据包括本列,第几列)表体的数据列样式customRender:(v
·
column中的align:left 属性虽然可以设置对齐方式,但会使得内容和标题一起改变。
解决方案:
1.column中不使用框架默认align,使用customRender()设置内容对齐方式
columns: [
{
title: '标题',
// align:"left",
dataIndex: 'title',
//(本列的值,所有行数据包括本列,第几列)表体的数据列样式
customRender:(value, row, index) => {
const obj = {
children: value,
attrs: {},
};
obj.attrs.align = 'left';//控制表体内容居右
return obj;
}
// scopedSlots: { customRender: 'titleSlot' }
},
]
2.通过css来改变表头样式,设置标题对齐方式
/deep/.ant-table-thead > tr > th {
text-align: center;
}
更多推荐
已为社区贡献1条内容
所有评论(0)