ant-design-vue a-table 表头添加tooltip

冰魂破

于 2021-08-24 23:38:08 发布

阅读量4.3k

点赞数 1

分类专栏： ant-design-vue 文章标签： html javascript html5

本文链接：https://blog.youkuaiyun.com/ks8380/article/details/119901043

版权

ant-design-vue 专栏收录该内容

4 篇文章

订阅专栏

闲话不说直接上代码

<a-table :columns="headerData" :dataSource="tableData" :pagination="pagination" :rowKey="res => res.order_num" :scroll="{ x: 1200,y:500 }" class="mb20">
        <span slot="customTitle">
          打款回单
          <a-tooltip placement="top">
            <template slot="title">
              <span> tooltip显示的文字   </span>
            </template>
            <a-icon type="question-circle" />
          </a-tooltip>
        </span>
      </a-table>

{
  id: "9",
  slots: { title: 'customTitle' },
  width: 100,
  ataIndex: 'receipt_file',
}

最主要的一点是确保 title的值和表头里面 slot 所对应的值是一直的，如本文提到的 customTitle