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属性指定元素内的空白怎样处理。
相关推荐
hhb_61819 小时前
MATLAB数值计算与数据可视化核心技术梳理及实战应用案例解析
前端
lichenyang45319 小时前
从零理解微前端:基于 React + Vite + qiankun 的子应用切换 Demo
前端·react.js·状态模式
2601_9577808419 小时前
AI智能体时代:为什么HTML正在取代Markdown成为新一代输出标准
大数据·前端·人工智能·gpt·html·claude
2301_8152795219 小时前
如何实现C++ Web 自动化测试实战:常用函数全解析与场景化应用指南
开发语言·前端·c++
代码不停19 小时前
Spring Web MVC
前端·spring·mvc
倾颜1 天前
从 textarea 到 AI 输入框:用 Tiptap 实现 / 命令、@ 引用和结构化请求
前端·langchain·next.js
kyriewen1 天前
程序员连夜带团队跑路,省了23万:这AI太贵,真的用不起了
前端·javascript·openai
kyriewen1 天前
你写的代码没有测试,就像出门不锁门——Jest + Testing Library 从入门到不慌
前端·单元测试·jest
yuzhiboyouye1 天前
web前端英语面试
前端·面试·状态模式
canonical_entropy1 天前
下一代低代码渲染框架 nop-chaos-flux 的设计原则
前端·低代码·前端框架