前端使用ElementUI +Vue table表头添加tooltip悬浮提示框

时间:2025-01-18 17:30:25

<el-table
empty-text=“正在加载中…”
:data=“contentList”
style=“width: 100%”
@sort-change=“sort”
class=“pro-table-item”
tooltip-effect=“dark”

 <template v-for="(item,index) in titleList">
   <el-table-column
        v-if="index == '0'"
        :prop="()"
        :label="item"
        sortable="custom"
        min-width="120"
        :render-header="renderHeader"
     >  
   </el-table-column>
      <el-table-column
           v-else
           :prop="()"
        :label="item"
        min-width="120"
        :render-header="renderHeader"
        show-overflow-tooltip



renderHeader(h, { column }) {
if(>13) {
return (

{}

)
} else {
return (
{}
)
}
},
并不想让所有的表头都弹出tooltip,只想让超出长度并且

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;