antd 的table td 超出部分隐藏并显示省略号

佚名 6年前 (2019-05-09) 随笔 1549人围观抢沙发百度已收录

//需求是描述内容过长时将超出部分隐藏并显示省略号，鼠标放上去可查看全部信息
columns = [
     { title: '描述', dataIndex: 'desc',key:"desc",
      onCell: () => {
        return {
          style: {
            maxWidth: 150,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow:'ellipsis',
            cursor:'pointer'
          }
        }
      },
      render: (text) => <Tooltip placement="topLeft" title={text}>{text}</Tooltip>
    },       
]

　　render() {
　　　　return(
　　　　　　<Table
　　　　　　　　dataSource = {list}
　　　　　　　　columns = {this.columns}
　　　　　　　　loading = {loading}
　　　　　　/>
　　　　)
　　}