react antd 实现 超出长度省略 鼠标悬停显示完整信息

背景

• 在页面显示日志异常信息 但是 不能太长影响页面布局 需要显示 固定长度并提示

查阅文档

• Typography.Text#

• ellipsis 自动溢出省略，为对象时不能设置省略行数、是否可展开

代码实现

<Text
        style={ellipsis ? { width: 100 } : undefined}
        ellipsis={ellipsis ? { tooltip: ' test api text !' } : false}
      >
       test api text  test api text   test api text  test api text  test api text 
      </Text>