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属性指定元素内的空白怎样处理。
相关推荐
zhixingheyi_tian7 分钟前
Yarn 之 run job
java·开发语言·前端
指尖跳动的光9 分钟前
如何减少项目里面if-else
前端·javascript
yanghuashuiyue11 分钟前
Vue3难以统一的命名规范
前端·vue.js·typescript
码界奇点33 分钟前
基于Spring Cloud与Vue.js的微服务前后端分离系统设计与实现
vue.js·后端·spring cloud·微服务·毕业设计·源代码管理
mini_05538 分钟前
elementPlus版本升级,el-select默认值显示问题
前端·javascript·vue.js
C_心欲无痕1 小时前
vue3 - watchPostEffect在DOM 更新后的副作用处理
前端·vue.js
教练、我想打篮球1 小时前
123 safari 浏览器中下载 URLEncoder.encode 的中文名称的文件, safari 未进行解码, 其他浏览器正常
前端·http·safari
小白x1 小时前
Echarts常用配置
前端
hello_Code1 小时前
css和图片主题色“提取”
前端
小杨梅君1 小时前
Vue3与iframe通信方案详解:本地与跨域场景
前端·vue.js