vuejs axios全局封装loading加载

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
})

进入官网入口

vue安装axios脚手架报“ ./node_modules/axios/lib/core/mergeConfig.js”错误解决方法

网站加载中loading..样式五代码介绍

网站加载中loading..样式四代码介绍

网站加载中loading..样式三代码介绍

网站加载中loading..样式二代码介绍

标签： axios, loading, 全局, 封装

上面是“vuejs axios全局封装loading加载”的全面内容，想了解更多关于 vuejs 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_106.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！