ant框架里,Table表格组件里自定义表格td内容换行的方法
在Table表格里,无法像普通原生html一样直接在标签内使用‘br’或换行符使表格内容换行
必须在表格组件的columns方法里对需要换行的地方使用render自定义换行,
使用方法如下:
columns = [
{
title: '驻场',
// 子单元格
children: [
{
title: '驻场姓名',
width: 120,
dataIndex: 'nameData',
key: 'nameData',
align: 'center',
// 自定义表格换行方法
render: (text, record) => {
let snArray = [];
snArray = text.split("-");
let br = <br></br>;
let result = null;
if (snArray.length < 2) {
return text;
}
for (let i = 0; i < snArray.length; i++) {
if (i == 0) {
result = snArray[i];
} else {
result = <span>{result}{br}{snArray[i]}</span>;
}
}
return <div>{result}</div>;
}
},
{
title: '驻场电话',
width: 160,
dataIndex: 'phoneData',
key: 'phoneData',
align: 'center',
},
],
align: 'center',
},
]
网友评论