React使用antd表格渲染html字符串(dangerSet

接口返回的数据中有html字符串

用antd的Table组件展示渲染

<Table dataSource={dataSource} columns={columns} pagination={false} size='small' />;

const columns = [
    {
        title: '名称',
        dataIndex: 'SBMC',
        key: 'SBMC',
        render: (value: string) => <div dangerouslySetInnerHTML = {{__html:value}} ></div>,
    }
];

实现效果截图

通常dangerSetInnerHTML(这个糟糕的单词，，这么长。。)是和__html配套使用的，用来在一个标签中插入许多个标签(安全的插入)。
之所以是有2个{{}}，是因为第一{}代表jsx语法开始，第二个是代表dangerouslySetInnerHTML接收的是一个对象键值对

单独拿出来用就是渲染html字符串

            <div
                dangerouslySetInnerHTML={{
                    _html: '<h3>Hello World</h3>'
                }}>
            </div>

也可以渲染普通的字符串(无卵用)

            <div
                dangerouslySetInnerHTML={{
                    _html: 'Hello World'
                }}>
            </div>