<template>
<div class="app-container">
<el-table v-loading="loading" :data="List">
<el-table-column label="标题" align="center" key="header"
:render-header="(h, { column }) => showHeader(h, { column }, '这是提示信息内容')">
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
data() {
return {
loading: false,
List:[{header:'111'},{header:'222'},{header:'333'}]
};
},
methods: {
showHeader(h, {column, $index},content) {
return [
column.label,
h(
'el-tooltip',
{
props: {
content: content,
placement: 'top' // 悬停内容展示的位置
}
},
[h('span', {class: {'el-icon-question': true}})] // 图标
)]
},
}
};
</script>
element-ui table标题的提示信息显示
最新推荐文章于 2024-06-13 15:53:35 发布