element-ui简单方法实现自定义表头(render-header)
作者:互联网
:render-header="renderHeader"使用renderHeader这个方法
<el-table-column
prop="postingAmt"
label="已过账金额(元)"
align="center"
show-overflow-tooltip
:render-header="renderHeader"
width="160"
><template slot-scope="props">{{ $number2money(props.row.postingAmt) }}</template>
</el-table-column>
renderHeader(h, { column }) {
// h即为cerateElement的简写,具体可看vue官方文档
return h('div', [
h('span', column.label),
h(
'el-tooltip',
{
props: {
effect: 'dark',
content: '已过账金额=过账成功商品的商品金额汇总+商品绑定的运费汇总',
placement: 'top'
}
},
[
h('i', {
class: 'el-icon-question',
style: 'color:#409eff;margin-left:5px;cursor:pointer;'
})
]
)
])
}
标签:el,自定义,render,header,表头,过账,props,renderHeader 来源: https://blog.csdn.net/weixin_44094836/article/details/113570163