代码:
methods(){
// this.$nextTick并不是必须的,当表格使用v-if才能显示时,必须使用 this.$nextTick
//可根据自己的需求,修改加载的标签体target: document.querySelector("可修改")
/**当多个表格使用v-show切换显示时,给每个表格定义一个独一无二的class,然后更改querySelector的内容
document.querySelector(".自定义类名 .el-table__body-wrapper")*/
/**el-dialog中使用局部加载时,要更改querySelector中的内容为:
document.querySelector(".el-dialog__body .el-table__body-wrapper")
*/
this.$nextTick(()=>{
const loading = this.$loading({
lock: true,//同v-loading的修饰符
text: '加载中',//加载文案
backgroundColor: 'rgba(0, 0, 0, 0.7)',//背景色
spinner: 'el-icon-loading',//加载图标
target: document.querySelector(".el-table__body-wrapper")//loading需要覆盖的DOM节点,默认为body
});
//调用后端接口的方法
getTableList(参数).then((res) => {
loading.close();//关闭加载
this.tableData = res;
}).catch(err=>{
loading.close();
});
})
}