antd中table组件中如何进行换行操作（react中）

说明

react项目，遇到某字段对应的单元格内需要换行。

最初想偷懒，尝试了在数据中加入回车、使用模板字符串、转义字符，都没用。

最后实现方法是在antd渲染column的对象对应的字段中加入render属性实现。

效果

数据

代码

      {
        title: '字段名',
        width: 200,
        align: center,
        render: (str, column, index) => {
          //悬停标题
          let title = str.toString();
          //特殊字段需要添加表格内回车
          if (column === '字段名') {
            let snArray = [];
            //splitE是分割符，修改为自己数据的分隔符，我用的是"$;$"
            snArray = str.split(splitE);
            //悬停标题将分隔符转义显示
            title = snArray.join('\n');
            let br = <br></br>;
            let result = null;
            if (snArray.length >= 2) {
              for (let i = 0; i < snArray.length; i++) {
                if (i === 0) {
                  result = snArray[i];
                } else {
                  result = (
                    <span>
                      {result}
                      {br}
                      {snArray[i]}
                    </span>
                  );
                }
              }
              str = <div>{result}</div>;
            }
          }
          let html = <label title={title}>{str}</label>;
          return html;     
        },
      }