<el-table
v-loading="loadingShow"
element-loading-text="数据正在加载中..."
此处省略好几行>
<template slot="empty">
<div style="margin-top: 15%">
<img src="../../../img/icon.png" alt="暂无数据">
<br>
<span>暂无数据</span>
</div>
</template>
<el-table-column prop="" lable="">
......
</el-table>
v-loading是loading效果,即查询数据的时候前台给用户一个loading样式,通过element-loading-text设置在loading界面的是提示信息。
示例中v-loading里的loadingShow的初始值要设置为false,每当点击查询时,要手动改为true,查询结束后要改回false
示例中引入的图片是第一次进入页面时展示的样式。
下图为表格暂无数据和处于loading页面的展示效果: