主题思路
1.通过路由判断show-overflow-tooltip显隐状态
2.设置页面展示效果
一、通过路由判断show-overflow-tooltip显隐状态
代码如下(示例):
<el-table-column
label="头部名称"
width="180"
align="center"
:show-overflow-tooltip="
$route.path == '/routeName' ? true : false
"
>
<template slot-scope="scope">
<div class="hider">
{{ scope.row.content}}
</div>
</template>
</el-table-column>
- '/routeName’为当前页面路由
- hider为css样式
二、设置页面展示效果
代码如下(示例):
//超出显示...
.hider {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
列表的css展示样式,超出隐藏并显示… 使show-overflow-tooltip在切换显隐中做到神不知鬼不觉。