Vue2.0+Element-ui(2.15.13)出现el-table不显示问题解决方案

最新推荐文章于 2024-04-21 01:21:56 发布
最新推荐文章于 2024-04-21 01:21:56 发布
阅读量5.5k 收藏 10
点赞数 7
分类专栏： 前端开发 文章标签： vue.js elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Smart_11/article/details/129961028
版权

遇到的问题：

Element-ui中的 el-table组件 无法正常显示；

1.安装的Vue是2.0版本；

2.安装的Element-ui是2.15.13版本

原因：

1.一个项目调用了element-ui和vant两个ui库，有冲突；

2.Element-ui是2.15.13版本依赖比较高；

 

解决方案：

1.npm uninstall element-ui；下载Element-ui

2.npm install element-ui@2.8.3

3.一定要重启

说明：@后面可以紧跟着是下载版本，如果不写；默认下载的是最新版本；

 

Smart_11
关注
  • 7
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
vue2使用element-ui，el-table不显示，用npm安装！！！！
xtcyolo的博客
04-14 587
原因：用cnpm安装可能会不显示，直接卸载然后重新安装，用npm。记录：el-table不显示，其他组件一切正常。
Element-UI vue2使用el-table数据不显示解决方案
weixin_51641169的博客
07-27 1万+
Element-UI vue2使用el-table数据不显示解决方案
记录el-table无法显示问题
最新发布
weixin_48111439的博客
04-21 340
检查main.js文件里Vue的引入，将 import Vue from 'vue/dist/vue' 改为 import Vue from 'vue'Element UI使用其他组件正常，使用到table组件后，即使照搬Element UI的例子，表格也不显示，如果data为[]，会显示暂无数据。
关于Element-ui中Table表格无法显示的问题及解决
Ultravioletrays的博客
06-28 7852
今天在书写代码时遇到的问题，el-table在页面中突然显示为空白，检查了甚至重复粘贴的几次官网代码都不行，后来在网上查阅了相关资料，解决了问题。问题就出现在此步骤：在浏览器输入url，回车后，浏览器空白，什么都不显示。注意：原来项目中的element-ui版本是2.13.0，上图显示的是我重新安装的element-ui依赖版本号。最终找到问题的根源是element-ui依赖版本太高，换一个低版本的依赖即可。element-ui的依赖版本过高所导致的，将其该成低版本即可，亲测可用。(1)在package.
el-table不显示问题
m0_62434937的博客
09-15 5975
el-table不显示的阴间bug
记一次element-ui的table不显示，也不报错的问题
sundaoli_0的博客
03-02 3589
element-ui 的表格组件，死活不显示表头，给数据的话整个就空白，不给数据就只显示一个 “暂无数据”，找了半天的原因，甚至重建项目，最终排查的原因是 vue.config.js 下面的这段代码出了问题。element-ui版本：2.15.13。控制台也不报错，将版本也不行。vue版本：2.6.14。
vue使用element-ui，el-table不显示
weixin_48282959的博客
04-12 9775
项目场景： 例如：新增了一个表格，按官网代码贴过来的，结果一直不显示 问题描述 代码如下一模一样，其他数据正常显示，就表格不显示 <template> <el-table :data="tableData" stripe style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-tabl
element-ui table合计行不显示问题
cmj8043719242的博客
02-02 1776
table合计行不显示问题
Java毕业设计：外卖点餐系统（springboot+vue+vant+element-ui）.zip
05-03
Java毕业设计：外卖点餐系统（springboot+vue+vant+element-ui） Java毕业设计：外卖点餐系统（springboot+vue+vant+element-ui） Java毕业设计：外卖点餐系统（springboot+vue+vant+element-ui） Java毕业设计：...
Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0后台管理系统
05-02
Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0+Axios 开发的后台管理系统 Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0+Axios 开发的后台管理系统 Vue 3.0+Vite 2.0+Vue-Router4.0+...
权限管理系统 vue2.0 + element-ui.zip
10-12
权限管理系统 vue2.0 + element-ui
element-ui 2.15.9下载到本地资源最新版本压缩包（附element-ui本地引用方法）
06-04
本地引用示例： <!... <title>my ... <link rel="stylesheet" href="/my/html/element-ui/lib/theme-chalk/index.css"> <el-row> <el-col :span="24"><div class="myclass"></div></el-col> </el-row>
VUE2.0+Element-UI+Echarts封装的组件实例
08-27
下面小编就为大家分享一篇VUE2.0+Element-UI+Echarts封装的组件实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决Element-ui中Table表格无法显示的问题
热门推荐
Apple-yeran 的博客
08-22 3万+
今天项目中需要用到表格，于是就采用了由饿了么前端团队开发的Element-ui + Vue组合。 1、准备工作： 使用命令：cnpm i element-ui -S 进行安装Element-ui，安装好了之后，进行如下配置： 这样操作之后，就可以使用Element-ui插件了。 2、引用Element-ui官方文档中的Table表格代码 3、启动端口，并在浏览器访问 问题就出现在此步骤：在浏览器输入url，回车后，浏览器空白，什么都不显示。但是写一个插值表达式(如下图所示)，可以正常显示，就是表格不能显
传入el-table的数据结构
ZQH084811的博客
09-19 773
表格展示 <template> <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="n
luckysheet vue项目 初始化渲染后表格不显示问题
YangWenYu_lala的博客
03-31 1069
解决luckysheet 在vue项目中首次渲染 不显示问题
解决Element-UI el-table show-summary合计行不显示问题
tonetwo的博客
02-07 5067
解决Element-UI el-table show-summary合计行不显示问题
关于element-ui的el-table某列不显示或错乱问题
weixin_64482155的博客
10-18 7244
最近在利用el-table做表格时，突然出现某一列数据不显示问题，逐一排查后，并没有发现是什么原因，字段名和用法都没错，就是不显示，还出现了对应字段错乱问题。之后发现可能出现这类错误的原因，可能因为在一个页面有两个el-table表，其中prop的字段名都一样，也许是这样造成了冲突，导致一个正常显示，一个异常显示。直接去获取当前行的信息，拿出想要的数据进行显示；字段名和el-table-column的prop属性都能对上，但找不到错误原因；
关于elemet-ui升级版本导致el-table不展示这个事
深圳最菜前端
05-23 1116
背景：5年前的老项目了，然后新增了需求 起因：然后我顺手就引用了一个叫做el-description的描述组件，然后就写完了业务，然后本地调试了一下，咦，没展示，一看报错信息，然后顺手就升了个级，因为使用这个组件，要2.15.6以后才能用 经过：本地调试，没问题，真是一次完美的迭代，虽然在五年前的屎山里面遨游了一下，但是问题不大，然后熟练的git add. / git commit -m "xx功能新增 / git pull / git push /"，然后在Jenkins上打包，开始摸..
Vue2.0 + Element-ui2实现分页
05-14
要使用Vue2.0和Element-ui2实现分页，你可以按照以下步骤进行操作： 1.安装Element-ui ``` npm i element-ui -S ``` 2.在main.js中引入Element-ui ``` import Vue from 'vue' import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(ElementUI) ``` 3.在需要使用分页的组件中引入el-pagination组件，并设置相关参数 ``` <template> <div> <el-pagination :total="total" //总条数 :page-size="pageSize" //每页显示条数 :current-page.sync="currentPage" //当前页数 layout="total, sizes, prev, pager, next, jumper" //分页布局 :page-sizes="[10, 20, 30, 50]" //每页显示条数选项 @size-change="handleSizeChange" //页数改变时触发 @current-change="handleCurrentChange" //每页显示条数改变时触发 > </el-pagination> </div> </template> <script> export default { data() { return { total: 100, //总条数 pageSize: 10, //每页显示条数 currentPage: 1 //当前页数 } }, methods: { //页数改变时触发 handleSizeChange(val) { console.log(`每页 ${val} 条`); }, //当前页数改变时触发 handleCurrentChange(val) { console.log(`当前页: ${val}`); } } } </script> ``` 以上就是Vue2.0 + Element-ui2实现分页的基本步骤。你可以根据实际需求进行参数的调整和样式的修改。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值