首页 > 其他分享 >Element 中使用加载动画

Element 中使用加载动画

时间:2023-02-09 13:01:20浏览次数:46  
标签:动画 loadingInstance Loading index Element result 加载


<script>
// 1.引入动画组件
import { Loading } from 'element-ui';

export default {
name:"index",
data() {
return {
// 2.定义实例
loadingInstance:null,
list:[]
};
},

methods: {
getData(){
// 3. 生成动画
this.loadingInstance = Loading.service({
// 动画中的文字
text:'加载中',
// 要加载动画的容器
target:'.app-container'
});

this.$http.get('index').then((result) => {
if(res.code==10000){

this.list = result.data;
// 4. 请求完成后关闭动画
this.loadingInstance.close();
}
});

}

}
};
</script>

标签:动画,loadingInstance,Loading,index,Element,result,加载
From: https://blog.51cto.com/u_15959833/6046881

相关文章

  • Element 中根据屏幕大小动态计算表格高度以实现固定表头
    在ElementUI的表格组件中,要想固定表头,必须给表格指定一个高度,但是用户的屏幕大小是不一样的,为了能将表格底部的分页区域始终显示在屏幕内,就需要动态计算表格的高度。以下是......
  • CSS 3.0实现模拟手机信号加载动画
    给大家分享一个用CSS3.0实现的模拟手机信各异的加载动画,效果如下: 以下是代码实现,欢迎大家复制、粘贴和收藏。<!DOCTYPEhtml><htmllang="en"><head><metach......
  • 数据结构与算法-十大排序算法(动画演示)
    1.排序算法的概念1.1.算法相关名词;稳定:如果a原本在b前面,而a=b,排序之后a仍然在b的前面。不稳定:如果a原本在b的前面,而a=b,排序之后a可能会出现在b的后面。时间复杂度......
  • CSS 3.0实现霓虹灯按钮动画特效
    今天给大家分享一个用CSS3.0实现的霓虹灯按钮动画特效,效果如下:以下是代码实现,欢迎大家复制粘贴和收藏。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8">......
  • SVG滤镜波浪动画效果
    今天给大家分享一个用SVG实现的滤镜波浪动画效果,效果如下:以下是代码实现,欢迎大家复制粘贴和收藏。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><m......
  • Element 中查询前多少天、前多少周、前多少月的数据
    在开发后台管理系统时,经常会遇到这样一种需求,查询前多少天、多少周、多少月的数据,虽然UI框架有自带的组件可以实现这些功能,但是操作起来却不是很方便,而且这些都是查询最近......
  • Vue2.9.6安装element-ui
    阅读目录安装element-ui源码路由文件:E:\node\vue296\src\router\index.js入口:E:\node\vue296\src\main.js组件:E:\node\vue296\src\components\Count.vue......
  • ElementUI手动控制popover弹层的显示与隐藏
    转自于:https://huaweicloud.csdn.net/638f116ddacf622b8df8e566.html?spm=1001.2101.3001.6650.9&utm_medium=distribute.pc_relevant.none-task-blog-2~default~BlogComme......
  • 基于Docker使用CTB生成地形切片并加载
    1.引言CTB(CesiumTerrainBuilder)是一个用于地形切片的C++编写的命令行工具GitHub地址为:GitHub-geo-data/cesium-terrain-builder:AC++libraryandassociatedcom......
  • properties文件加载工具类
    importjava.util.HashMap;importjava.util.Map;importjava.util.Properties;/***@authorAdministrator*/publicclassPropertiesUtils{publicstaticMap<Str......