使用ant-design-vue a-table 超出部分隐藏并显示省略号

 如上图效果，个人最终的写法：

// 表头
      columns: [
        {
          title: '商户介绍',
          align: "center",
          dataIndex: 'introduction',
          key: 'introduction',
          customRender: (text, record) => <a-tooltip placement="topLeft" title={record.introduction}><span class="col-sql" title={text}>{text}</span></a-tooltip>
        }]
        

.col-sql {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  width: 100px;
}