给el-table-column设置 :show-overflow-tooltip="true" 属性可以使单元格超出的内容自动折叠显示,当鼠标移入时单元格的上方会自动弹出一个小tips来显示单元格得所有内容。
<el-table-column prop="taskName" label="任务名称" width="180" :show-overflow-tooltip="true" >
<template slot-scope="scope">
<div class="attributionOrg">{{ scope.row.attributionOrg || "——" }}
</div>
</template>
</el-table-column>
如果想要有超过一行用省略号表示的样式,可添加如下样式
// 超过一行可以生略表示
.attributionOrg {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}