给 element-ui 表格的表头添加icon图标

奋斗吧程序媛

已于 2022-09-03 07:57:19 修改

阅读量3.9k

点赞数 1

分类专栏： vue 文章标签：前端 elementui

于 2022-09-03 07:53:46 首次发布

本文链接：https://blog.csdn.net/m0_67841039/article/details/126673050

版权

vue 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

el-table icon图标的设置，使用 slot="header" 插槽，然后直接通过设置类名为 el-icon-iconName 来使用即可。

        <el-table-column prop="total" label="" >
          <template slot="header">
            订单总额
              <i class="el-icon-question"></i>
          </template>
        </el-table-column>

        <el-table-column prop="totalPurchase" label="">
          <template slot="header">
            已销售
            <i class="el-icon-question"></i>
          </template>
        </el-table-column>

        <el-table-column prop="totalReturn" label=" " show-overflow-tooltip>
          <template slot="header">
            已退款
            <i class="el-icon-question"></i>
          </template>
        </el-table-column>

效果展示：