el-table 表头添加Tooltip render-header动态传参
给el-table表头添加Tooltip,光标移动到表头问号区域,自动弹出tooltip提示
render-header传参方式
<el-table-column
prop="usedCredit"
label="已占授信额度(元)"
width="140"
header-align="center"
align="center"
:render-header="
(h, obj) =>
renderHeader(
h,
obj,
'授信列表(正常状态的【授信额度(元)】)+ 授信列表(逾期状态的【待还本金金额(元)】'
)
"
>
</el-table-column>
js
// 表头增加问号❓
renderHeader(h, { column, $index }, content_desc) {
return [
column.label,
h(
'el-tooltip',
{
props: {
content: content_desc,
placement: 'top',
},
},
[h('span', { class: { 'el-icon-question': true } })]
),
]
},