vue项目中请求接口时使用element的loading组件

import axios from 'axios';
import {  Loading } from 'element-ui';

var instance = axios.create({ //
  baseURL: process.env.BASE_API,
  responseType: 'json', // 返回json格式a
  withCredentials: true, // 默认的sessionId一致
  timeout: 0
});


// 在请求接口前创建loading参数
const options = {
  text: '载入中...',
  background: 'rgba(255,255,255,0.6)',
  spinner: 'el-icon-loading',
  lock: true,
  // target指定需要覆盖的 DOM 节点
  target: '#app'
};
let loadingInstance;



instance.interceptors.request.use((config) => {

  // 发起请求前先判断之前的loading是否存在
  if (loadingInstance) {
    loadingInstance.close();
  }
  // 开启loading
  loadingInstance = Loading.service(options);



  return config;
});
instance.interceptors.response.use((res) => {
  const data = res.data;
 
    if (data.code === 998) {
     // ...
      }).then(() => {
        window.location = '#/login';
        location.reload();
      });

    }



  // 关闭loading组件效果
  loadingInstance.close();


  return data;
}, (err) => {
  Message({
    type: 'error',
    showClose: true,
    message: '网络错误'
  });


  // 关闭loading组件效果
  loadingInstance.close();


  return Promise.reject(err);
});

instance.prototype.request = (url, data, method, success) => {
  // 异步对象
  var ajax = new XMLHttpRequest();

  // get 跟post  需要分别写不同的代码
  if (method === 'get') {
    // get请求
    if (data) {
      // 如果有值
      url += '?';
      url += data;
    }
    // 设置 方法 以及 url
    ajax.open(method, url);

    // send即可
    ajax.send();
  } else {
    // post请求
    // post请求 url 是不需要改变
    ajax.open(method, url);

    // 需要设置请求报文
    ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

    // 判断data send发送数据
    if (data) {
      // 如果有值 从send发送
      ajax.send(data);
    } else {
      // 木有值 直接发送即可
      ajax.send();
    }
  }

  // 注册事件
  ajax.onreadystatechange = function () {
    // 在事件中 获取数据 并修改界面显示
    if (ajax.readyState === 4 && ajax.status === 200) {
      // 将 数据 让 外面可以使用
      // return ajax.responseText;

      // 当 onreadystatechange 调用时 说明 数据回来了
      // ajax.responseText;

      // 如果说 外面可以传入一个 function 作为参数 success
      success(ajax.responseText);
    }
  };
};
export default instance;