如果table组件的数据来源于后端服务,确保后端服务正常运行,并且接口能正确返回所需数据。可以使用Postman等工具测试API接口,看是否能正确返回数据。 通过以上步骤,您应该能够定位并解决Element UI的table组件“暂无数据”的问题。如果问题仍然存在,可能需要进一步检查其他可能的配置或代码错误。
在表格等容器中加载数据时显示。 Element提供了两种调用Loading的方法: 指令 服务 对于自定义指令v-loading,只需要绑定Boolean即可。 默认状况下,Loading遮罩会插入到绑定元素的子节点,通过添加body修饰符,可以使遮罩插入至DOM中的body上。 <el-table v-loading="loading" :data="tableData" style="width: 100%">...
这里保留官方的handleSelectionChange,将val传给batchSelection变量,保存当前页的数据选择,然后触发一个检测方法 检测方法为:每次batchSelection数据变动时,将不重复的数据存储到allBatchSelection中 然后监听我的表格数据,当数据变动的时候(即上述的页码变动),再执行一次检测,并且将当前页曾勾选的回显 this.$refs.indexTa...
根据项目需要,获取后端接口返回数据请求过程中,table提示“数据加载中...”,请求成功后,若无数据提示“暂无数据”,有数据则展示数据。 根据如上需求,需要自定义element-ui table表格暂无数据时的样式。 1.只修改提示文字 直接在<el-table>中直接添加empty-text="数据加载中..."属性即可。 2.修改提示文字加图片 ...
getTableData(){//先将变量清空this.dataText='';this.$axios.getTableData().then(res=>{this.tableData=res.data;// 当请求后台,数据为空时,再让页面显示暂无数据if(this.tableData.length===0){this.dataText='暂无数据';}});}
1、如下图: 改成: 在el-table 里面插入 <template slot="empty"> <span style="color: #969799;">No more data</span> </templat
VUE + Element-UI 需求: 列表无数据时的显示如下图 1.png 由于列表的列数过长导致有横向滚动条出现,希望暂无数据以及这个img能够显示在滚动条与表头之间。 现状: 目前的实现形式是将暂无数据的提示封装为一个组件,无数据时显示在滚动条的下方,如下图 ...
1.整个表格无数据 需要展示UI给的一张图片,奈何element默认的是暂无数据的文字,如下图 这个比较简单,网上顺便找就出来了在标签中加入 // An highlighted block <el-table> <el-table-column></el-table-column> <div slot="empty" class="empty"> ...
1.实现效果如下: 2. 代码实现 1 2 3 4 5 6 7 8 9 10 11 12 13 <el-table empty-taxt="暂无数据"></el-table> css样式设置: .el-table__empty-text { display: block; text-align: center; width: 500px; // height: 200px; padding-top: 100px; ...