需求源源不断,代码越写越乱小菜鸡成长日记
el-table系列的需求又来啦~
有些时候表格的表头比较简洁或者是英文缩写,所以我们就需要给表头添加tip注释。
我们只需要将el-table-column的label属性去掉,然后使用插槽自定义表头内容就行啦
<el-table>
<el-table-column show-overflow-tooltip align="center" prop="mttr" min-width="150">
<template #header>
<span>MTTR</span>
<el-tooltip effect="light" content="设备故障平均恢复时间(min)" placement="top">
<el-icon style="font-size: 15px; color: #ffc447; display: inline-block; padding-bottom: 20px">
<svg-icon name="ep:question-filled"></svg-icon>
</el-icon>
</el-tooltip>
</template>
</el-table-column>
</el-table>
效果图: