React+Antd+DataV的轮播表悬停提示框

需求：在DataV组件的轮播表中，因为数据太长需要悬停查看所有数据 DataV组件：datav-react.jiaminghi.com/guide/scrol…

        轮播表：<ScrollBoard
                  config={{
                    header: ['设备名称', '事件描述', '告警时间'],
                    data: dataArray,
                    headerBGC: 'rgb(130, 212, 220,0.3)',
                    oddRowBGC: 'rgb(0,102,102,0.4)',
                    evenRowBGC: 'rgb(51,0,204，0.4)',
                    waitTime: 300000,
                    align: ['center'],
                  }}
              style={{ width: '100%', height: '6.5rem' }}
            >
            </ScrollBoard>

          dataArray是渲染表的数据，将想要提示的内容放进dataArray;
          如下：
             dataArray.push([                '行1列1',                `<Tooltip title="${topnEvent[i].description}">                ${topnEvent[i].description}
                </Tooltip>`,
                '行1列3',
              ]);
              
              

溢出隐藏：CSS记得设置将轮播表溢出隐藏，不然会重叠显示异常

    .dv-scroll-board .rows .ceil {
      overflow: hidden !important;
      white-space: inherit !important;
      text-overflow: clip !important;
    }

同时还需找到需要做提示框显示所有数据的列，添加对应的CSS溢出显示省略号

    根据自己的需求去找对应的列添加：我这里是第二列：
   > :nth-child(2) {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }