通过插槽添加空状态和样式 <template> <div> <el-table :data="tableData" stripe style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="name" label="姓名" width="180"> </el-table-column> <el-table-column prop="addr...
1 打开一个vue文件,插入一个el-table组件,设置组件的数据为一个空数组。如图 2 在el-table组件里插入template标签,在标签上添加slot="empty",然后插入一张名字为logo的图片。如图 3 保存vue文件后使用浏览器打开,这时候就可以看到组件上显示了logo图片。如图 ...
<el-table :data="data" :height="height" :stripe="stripe" :row-key="rowKey" :tree-props="{children: 'child', hasChildren: 'hasChildren'}" @selection-change="handleSelectionChange"> <!--自定义空行--> <empty-view slot="empty-text" text="暂无数据" /> <!--判断是否开启多选--> <el...
<el-tableid="table":data="tdata4"height="605"border style="width: 100%"><templateslot="empty"v-if="Isvip == 2"><!--<img class="data-pic" src="#" alt="" />-->//这里还可以加上你想要的图片样式<spanstyle="font-size: 20px">会员可以点击'选择产品'进行数据查看</span></templa...
el-table更换暂无数据样式 empty-text=" " javascript:void(0) <templateslot="empty">会员可以点击查看历史竞品查看<!--<img class="data-pic" src="#" alt="" />-->//这里还可以加上你想要的图片样式</template> 1. 2. 3. 4. //具体示例!!<el-tableid="table":data="tdata4"height="605"...
el-table-empty功能强化 <template v-slot:empty> <div style="width:64px;height:80px;"> <svg-icon icon-class="empty" class-name="svg-center size64" /> </div> <div style="line-height:16px;margin:10px 0;">暂无数据</div> </template>...
1.整个表格无数据 需要展示UI给的一张图片,奈何element默认的是暂无数据的文字,如下图 这个比较简单,网上顺便找就出来了在标签中加入 // An highlighted block <el-table> <el-table-column></el-table-column> <div slot="empty" class="empty"> ...
<template slot="empty"> <!-- <img src="@/assets/kongshuju.png" alt="" style="width:50px;height:50px;" class="mt-20"> --> <p class="noCart">{{ noDataShow }}</p> </template> <!-- 是否有全选列 --> <el-table-column v-if="selection" :fixed="selectionFixed" :selectable...
<el-table><el-table-column prop="subjectorderinfoNum" label="操作"><template slot-scope="scope"><el-button type="warning" @click="handleRemoveToSC(scope)">移除</el-button></template></el-table-column><!-- ele 暂无数据插槽 --><template slot="empty"><div class="noData"></div></...
1、为el-table增加懒加载功能,:load=“load” <el-table :data="tableData" row-key="id" :header-cell-style="{ color: '#333333' }" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" :load="load" lazy> <template slot="empty"> <div style="margin-top: 30px"> <...