在react项目中结合antd实现表格tooltip提示

react项目ant design给表格title添加tooltip提示效果，效果如下：

 title: () => (

        <span>

          {'原表'}&nbsp;

          <Tooltip

              title={'如有颜色标注 则表示id在该表无数据'}

          >

            <InfoCircleOutlined />

          </Tooltip>

        </span>

      ),

完整的表格代码

const DataModal=()=>{

     /** new表格数据*/

  const columns_new = [

    {

      title:"序号",

      dataIndex:"index",

    },

    {

      title: "账号Id",

      dataIndex: "advertiser_id",

    },

    {

      title: () => (

        <span>

          {'原表'}&nbsp;

          <Tooltip

              title={'如有颜色标注 则表示id在该表无数据'}

          >

            <InfoCircleOutlined />

          </Tooltip>

        </span>

      ),

      dataIndex: "original_table",

      onCell: (record, index) => getOriCellStyles(record.state),

    },

    {

      title: () => (

        <span>

          {'对比表'}&nbsp;

          <Tooltip

              title={'如有颜色标注 则表示id在该表无数据'}

          >

            <InfoCircleOutlined />

          </Tooltip>

        </span>

      ),

      dataIndex: "comparison_table",

      onCell: (record, index) => getComCellStyles(record.state),

    },

    {

      title: "原cost(元)",

      dataIndex: "cost",

    },

    {

      title: "对比cost(元)",

      dataIndex: "compare_cost",

    },

  ];

引入的antd

import {  DatePicker, Tooltip, Table, message} from "antd";

import { InfoCircleOutlined } from "@ant-design/icons";