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属性指定元素内的空白怎样处理。
相关推荐
进击的明明13 小时前
闭包:JavaScript里的“随身背包” 🎒
前端·javascript·面试
紫幽14 小时前
从 0 用 Vue 做屏并生成 LVGL 单片机代码(完整源码备忘)
前端·单片机
郭邯14 小时前
用 AI 辅助开发一个文件大小转换工具:从需求到上线的完整过程
前端
勾勾圈圈蛋蛋14 小时前
前中台项目
前端
触底反弹14 小时前
🔐 前端鉴权不再难!手把手带你搞懂 JWT + Zustand + Axios 的完整登录方案
前端·axios
打呵欠的猫14 小时前
我用 AI 写了一个"需求翻译器",产品的 PRD 直接变成开发任务清单
前端·ai编程
fatcoder14 小时前
玩转Nginx 09 — 运维排障:三场"火灾"实战演练
前端·后端·nginx
前端玩坑坑14 小时前
View Transitions API 入门教程,优雅过度
前端
李高钢15 小时前
WPF MVVM Light(三):RelayCommand 命令与 Messenger 消息
前端·c#·wpf
lichenyang45315 小时前
Socket.IO 原理与技术选型
前端