..._el-table-column内容不换行">
赞
踩
项目使用ElementUI,在显示时,如果某一个数值长度超过列宽,会默认换行,如下
这样的话造成页面动态变化,很难看,可以通过给el-table-column增加show-overflow-tooltip样式来解决。
- <el-table-column prop="goodscode" label="货物代码" width="80" show-overflow-tooltip>
- <template scope="scope">
- <div style="text-decoration:underline;cursor:pointer;">
- {{ scope.row.goodscode}}
- </div>
- </template>
- </el-table-column>
添加了该设置后,如果数据长度无法在指定宽度完全显示,多余的数据会默认隐藏,不会换行,当鼠标滑过该数据时,会以tip形式弹出所有数据内容。类似于下边
鼠标移动到“测...”上,显示如下
注意:该属性需要谨慎使用,如果一个页面多列使用,会影响页面加载速度。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。