vue在axios.js文件中封装全局loding,请求接口开启,请求成功或者请求失败关闭

import axios from 'axios'

import { Loading } from 'element-ui';

const server = axios.create({

baseURL: '',

timeout: 50000

})

let requestCount = 0;

let loadingInstance = null;

//请求拦截

server.interceptors.request.use(config => {

// config.headers['token'] = "758ab7aa755e46e68c0a16adf9549a92"

if(requestCount == 0) {

loadingInstance = Loading.service({

lock: true,

text: '拼命加载中',

spinner: 'el-icon-loading',

background: 'rgba(0,0,0,0.6)',

customClass: 'loadingClass'

});

let BOX = document.querySelector(".loadingClass");

BOX.style.zIndex = "999999"

}

requestCount += 1;

return config

},error=>{

requestCount -= 1

if(requestCount <= 0 && loadingInstance ) {

requestCount = 0

loadingInstance.close();

}

return Promise.reject(error);

})

//响应拦截

server.interceptors.response.use(res => {

requestCount -= 1

if(requestCount <= 0 && loadingInstance ) {

requestCount = 0

loadingInstance.close();

}

return res.data

},error=> {

requestCount -= 1

if(requestCount <= 0 && loadingInstance ) {

requestCount = 0

loadingInstance.close();

}

return Promise.reject(error);

})

export default server