主要是记录遇到的问题
需求是这样,在表头旁边自定义一段提示文字,鼠标停留的时候展示给用户查看,效果如下
看了一下element官网的文档,可以用插槽来实现
首先在表头的自定义插槽上,插入一个tooltip组件,然后利用tooltip组件达到鼠标悬停展示提示文字的效果
<el-table-column prop="" >
<!-- 自定义表头的插槽 solt=header -->
<template slot-scope="{}" slot="header">
<span>表头名称</span>
<el-tooltip class="item" effect="light" placement="top">
<!-- 显示的问号 -->
<i class="el-icon-question" style="font-size: 16px; margin-left: 20px"></i>
<!-- 提示插槽 -->
<div slot="content">
<p>
//需要展示的文字
</p>
</div>
</el-tooltip>
</template>
</el-table-column>