vue el-table 超出隐藏移入弹窗显示
场景
处理空间有限或者需要展示详细但非即时必要信息
效果如下
关键代码
<el-table-column show-overflow-tooltip prop="demo" label="label-name" width="120"></el-table-column>
完整案列
<template>
<div class="container">
<el-table :data="demoList">
<el-table-column label="姓名" prop="name" width="90"></el-table-column>
<el-table-column label="性别" prop="sex" width="80"></el-table-column>
<el-table-column label="年龄" prop="age" width="70"></el-table-column>
<el-table-column show-overflow-tooltip prop="demo" label="label-name" width="120"></el-table-column>
</el-table>
</div>
</template>
<script>
export default {
data() {
return {
demoList: [
{
name: '张三',
sex: '男',
age: '18',
demo: 'show-overflow-tooltip demo',
},
],
}
},
}
</script>
完结！！！