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属性指定元素内的空白怎样处理。
相关推荐
lyyl啊辉12 小时前
6. Vue开源三方UI组件库
vue.js
码云数智-大飞12 小时前
微前端架构落地实战:qiankun vs Module Federation 2026 深度对比与选型指南
前端·架构
IT枫斗者12 小时前
MyBatis批量插入性能优化:从5分钟到3秒的工程化实践
前端·vue.js·mysql·mongodb·性能优化·mybatis
前端 贾公子12 小时前
深入理解 Vue3 的 v-model 及自定义指令的实现原理(中)
前端·html
Never_Satisfied13 小时前
在HTML & CSS中,img标签固定宽度时,img和图片保持比例缩放
前端·css·html
Cache技术分享13 小时前
327. Java Stream API - 实现 joining() 收集器:从简单到进阶
前端·后端
人工智能先锋13 小时前
从零部署你的24小时AI管家:OpenClaw完整实战指南(附踩坑记录)
前端·github
不是株13 小时前
苍穹外卖(前端)
前端
zheshiyangyang13 小时前
前端面试基础知识整理【Day-6】
前端·面试·职场和发展
星火开发设计13 小时前
关联式容器:set 与 multiset 的有序存储
java·开发语言·前端·c++·算法