Vue+Element-ui 中 使用el-table 设置表格单元格 (el -table-column) 保留空格和换行

遇到的问题

在使用 el-table 展示数据时,单元格中的数据中存在多个空格和换行符,若不进行设置,浏览器默认会取消空格和换行符。

解决办法

将单元格的样式 "white-space" 属性设置为"pre-wrap" 即可解决

css 复制代码
::v-deep .el-table .cell {
  white-space:pre-wrap;
}

Tips

bash 复制代码
white-space属性指定元素内的空白怎样处理。
相关推荐
IMPYLH19 小时前
HTML 的 <th> 元素
前端·html
风骏时光牛马19 小时前
AI浪潮下程序员的职场破局与能力成长思考
前端
ljt272496066119 小时前
Vue笔记(九)--defineEmits
javascript·vue.js·笔记
IMPYLH19 小时前
HTML 的 <thead> 元素
前端·html
FungLeo1 天前
成为全栈·React 管理后台篇·总复盘:从“接口能调通”到“后台值得使用”
前端·react.js·前端框架·项目复盘·成为全栈
Csvn1 天前
并发模式:让渲染学会排队、插队和让路
前端
可乐鸡翅yeah_1 天前
新手梳理:M3U8 线上问题,哪些是前端锅,哪些是后端锅
前端·ios·音视频·实时音视频·m3u8·音视频在线播放
Flynt1 天前
Linear 用 1000 个 PR 换掉 styled-components,我写了 200 个按钮,把这笔账复现了一遍
前端·css·preact
JavaGuide1 天前
NVIDIA 又开源了!这次给 AI Agent 加上权限管控
前端·后端
excel1 天前
prisma 如何处理数据库竞态
前端·数据库·后端