【Element】el-table，ie浏览器，无数据时样式变形问题

已于 2023-09-14 15:28:00 修改
阅读量877 收藏
点赞数
分类专栏： # element-ui 文章标签： vue.js elementui
于 2020-08-13 18:57:41 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36762765/article/details/107988185
版权

使用el-table，在IE浏览器，"暂无数据"，挤到第一列问题。

如图：有数据时

 使用"v-show" 控制显示正常 

 使用"v-if" 控制显示变形

注：页面是用的JSP+Vue 

KAI丶
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
解决table数据量大在IE中不兼容的问题
sukie_0618的博客
03-01 743
项目场景： vue（element-ui) + springboot 要求table一页显示一百条数据。 数据要求经过处理再展现在前端，需要经历多次遍历。 问题描述： 数据量过大，且需要处理。 数据加载的时间长，且下拉滚动条的时候十分卡。IE尤其卡。 原因分析： 数据量过大和格式改变element-ui原有的el-table组件不够合适 IE不兼容 解决方案： 一开始换成了vxe-table，是一个专门做table的组件，里面很多功能都很好用，就是文档写的特别多简略，需要...
el-table-infinite-scroll:El-Table无限滚动
05-26
element-ui 的表格与无限滚动的结合（el-table + infinite-scroll）。查看实例教程此指令依赖于 element-ui@2.12.0，使用前请熟悉：element-ui@2.12.0element-ui@2.12.0安装npm install --save el-table-infinite-...
elementUI兼容ie浏览器问题（笔记）
qq_38734862的博客
05-11 6661
initial 关键字用于设置 CSS 属性为它的默认值，可作用于任何 CSS 样式。但是IE 不支持该关键字。我们只能在子元素中继续写相同的css来兼容ie，不然样式会出问题。 案例： 在使用elementui的对话框时，经常会把标题居中显示（如下图） 打开ie控制台会看到 text-align样式报错，这是因为IE 不支持initial关键字导致的，所以修改下text-align: left旧容兼容ie浏览器。 未完，待补充更新 ...
el-table列拖动操作栏变形
cyf841992086的博客
09-07 280
解决el-table表格表头拖拽操作栏变形问题
vue项目服务器与本地样式,在IE浏览器下，vue项目上传服务器后样式与本地有差异怎么回事？...
weixin_42153691的博客
08-06 312
在一个vue项目中，ie11浏览器与360浏览器中，本地跑代码localhost:8080与在服务端ip地址上有差异，具体如下本地样式这个是正常的样式，本地跑的，ie11和360以及其他浏览器都没有问题，但是在服务端就变了如果我在服务端点击页面上任何一处地方或者是移入鼠标进入导航条区域就恢复了正常了以下是代码html首页css.router-link-exact-active{background...
element ui 表格缩放在IE或者谷歌浏览器里会有线条消失
lyd77777777的博客
12-19 462
element ui 表格缩放在IE或者谷歌浏览器里会有线条消失
ElementUI中Tree组件兼容IE解决方案
Planing & Design & Arrange & Do & willWinner
02-26 2910
（时间：2019年2月26日，当前版本：0.5 ，最新版本：1.0 ，更新周期单位：周) 博客引言：精彩的编程人生(Programing Life)，从这里刚刚开始。 博客目的：记录Element与Vue搭配使用时，兼容IE浏览器不显示问题，剖析对IE浏览器的知识体系。 一、简介 在软件开发初期阶段，经常会使用是市面上主流的浏览器进行功能开发，调试。为什么呢？ 因为市面上主流...
vue修改Element的el-table样式的4种方法
10-14
在Vue.js中，Element UI库提供了丰富的组件，其中包括el-table，用于创建数据表格。然而，有时我们可能需要根据项目需求自定义el-table的样式。本文将详细介绍四种在Vue中修改Element UI el-table样式的有效方法。 ...
Element-UI升级后，el-table不显示 空白问题 备份包 资源备份
10-26
然而，在进行Element-UI版本升级时，可能会遇到一些兼容性或配置问题，导致组件无法正常工作，比如在本案例中提到的“el-table不显示空白问题”。以下是对这个现象的深入分析及解决策略。 首先，让我们了解可能的...
vue2.0 + element UI 中 el-table 数据导出Excel的方法
08-27
Vue2.0 + Element UI 中 el-table 数据导出 Excel 的方法 以下是对 Vue2.0 + Element UI 中 el-table 数据导出 Excel 的方法的详细解释： 1. 安装相关依赖 在使用 Vue2.0 + Element UI 中 el-table 数据导出 ...
el-table样式错乱解决方案
qq_71214810的博客
01-19 1426
如图所示，又被提bug了，这个bug我都不知道改了多少次了。。。 图片右边的椭圆框住的地方，在页面放大缩小之后就对不齐了。
IE与火狐对html中table表换行和居中问题,（2012.06.08）
web开发
06-08 173
问题描述：IE与火狐对html换行问题采用了不同的机制，当html里面存在一个表格的时候，表格里面的数据单词无换行或空格，如DSFSDFSDF/DSFSDFSDF/SDFSDFSDF/SDFSADFSAD/SDFSDFDS，在火狐显示中会自动进行换行处理，在IE里面他不会对该长单词进行自动换行处理，就会将表格撑大，使得用IE浏览该html的时候css样式会变形，出现如下问题： 而火狐能够正常...
el-table的样式错乱解决、支持跨页多选
qq_43901960的博客
01-29 567
el-table的样式错乱解决、支持跨页多选
关于vue项目在IE浏览器不兼容问题
qq_40731891的博客
05-26 2548
这是我第一次写博客，有不合适的地方请大神哥哥，神仙姐姐多多指点；不在矫情了，直接步入主题。 关于vue项目在IE浏览器不兼容解决方案网上有很多。但是，说的太简单了，我通过大量百度和实践从新整理一下： 1.安装babel-polyfill 插件 npm install --save-dev babel-polyfill 或者 npm install babel-polyfill --save-dev 或者 npm install babel-polyfill -D 2.在s...
vue项目系统兼容IE浏览器问题以及解决方案
热门推荐
qq_26887683的博客
05-16 1万+
系统兼容IE浏览器问题以及解决方案 问题 vue项目在IE浏览器上运行时会出现兼容性问题：JavaScript语法报错，css样式错乱。原因是在IE（以IE11为例）浏览器下，部分js的写法需要改变，部分样式在IE浏览器上不支持，以及一些IE浏览器特有的问题。 vue 只兼容ie8以上版本； IE 不兼容 axios的promiss对象; IE 不兼容es6语法； 解决方案 下载对应插件包解决js兼容性问题：babel-polyfill，es6-promise以及 babel-plugin-
element-ui的el-table表格错位问题
xiubinxu的博客
08-25 1068
el-table表格错位问题 使用el-table在ie浏览器出现，谷歌偶尔出现的问题，如下图 this.$nextkTick(() => { this.$refs.table.doLayout() // 解决表格错位 }) 有时候表格里面的表格可能会撑不开，挤在一起，这个时候可以试试使用样式解决 /deep/ .el-table{ // ie表格撑不开问题 .el-table__header{ width:100% !important; } .el-table__body{
Vue Element UI el-table 样式属性重叠发生错位
天渺(喵)工作室
09-27 2178
问题的应用场景发生在一个页面 多个table，用v-if 来控制不同的 Table 显示和隐藏, 第一个表格的ref="multipleTable" 选框属性会重叠叠加到另一个没有选框的表格上, 本来以为是diff 算法的问题，最后经过各种测试发现不是,没有查看element 的源码 推测应该是 elementUI 官方的业务逻辑不够严谨导致的 - - 官方文档中的this.$refs.table.doLayout(); //ref="table"没有任何作用 问题代...
ElementUI：表格table列宽度压缩出现空白
彭世瑜的博客
10-26 2213
table { width: 100% !important; }
elementUI中表单里面的select选择器字体被挤压如何设置宽度
m0_49714202的博客
04-24 2647
只需要给el-form加一个label-width="100px"宽度加大,或者设置auto即可,源码如下: <el-form :rules="loginFormRules" :model="form" label-width="auto"> <el-form-item prop='method' label="Method"> <el-select v-model="form.method" placehold.
element-plus el-table el-table-column 根据后端返回数据动态生成
最新发布
03-23
element-plus是一套基于Vue.js的UI组件库，提供了丰富的组件和功能，其中包括了el-table和el-table-column组件。 el-table是element-plus中的表格组件，用于展示数据。它可以根据后端返回的数据动态生成表格内容。...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值