1、定义Loading
import { Loading} from 'element-ui';
let loading = null;
2、请求之前拦截中启动loading
axios.interceptors.request.use(config => {
//全局加载,请求之前发送loading
loading = Loading.service({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
return config;
});
3、响应拦截器即异常处理中关闭loading
axios.interceptors.response.use((response, config) => {
loading.close();
return response
})
以上是编程学习网小编为您介绍的“vuejs axios全局封装loading加载”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vuejs axios全局封装loading加载
基础教程推荐
猜你喜欢
- JavaScript之BOM location对象+navigator对象+history 对象 2023-12-03
- 将多个查询数据合并到单个HTML表中(PHP,MySQL) 2023-10-27
- 详解flex多列布局遇到的问题和解决方案 2024-04-07
- 关于css:如何在离子中心对齐的标题上添加图标 2022-09-21
- 深入探究JavaScript中WeakMap的原理与用法 2023-07-09
- nginx删除.php和.html文件扩展 2023-10-25
- js直接编辑当前cookie的脚本 2023-12-01
- Typescript井字棋的项目实现 2022-10-21
- 纯css3实现鼠标经过图片显示描述的动画效果 2024-01-22
- 通用的二级菜单代码(css+javascript) 2024-01-22