element ,vantUI写数据加载延时出现loading

element:


let loading;
// 出现请求过慢时loading出现
var clearSettimeout;
function startLoading() {
  clearSettimeout = setInterval(() => {
    loading = Loading.service({
      lock: true,
      text: "努力加载中……",
      background: "rgba(0, 0, 0, 0.1)"
    });
  }, 3000);
}
function endLoading() {
  clearTimeout(clearSettimeout);
  clearSettimeout = null;
  if (loading) {
    loading.close();
  }
}
// loading互不冲突调用
let needLoadingRequestCount = 0;

export function showFullScreenLoading() {
  if (needLoadingRequestCount === 0) {
    startLoading();
  }
  needLoadingRequestCount++;
}

export function tryHideFullScreenLoading() {
  if (needLoadingRequestCount <= 0) return;
  needLoadingRequestCount--;
  if (needLoadingRequestCount === 0) {
    endLoading();
  }
}

// 默认超时设置
/* eslint-disable */

// axios.defaults.timeout = 60000 * 10
axios.defaults.timeout = 60000 * 2
// 相对路径设置
axios.defaults.baseURL = ''
// loading图

// http request 拦截器
axios.interceptors.request.use(
  config => {
    // 设置参数格式
    if (!config.headers['Content-Type']) {
      config.headers = {
        'Content-Type': 'application/json'
      }
    }
    // 判断ie加时间戳防止不请求接口
    if (window.ActiveXObject || 'ActiveXObject' in window) {
      config.url = `${config.url}?time=${new Date().getTime()}`
    }
    showFullScreenLoading()

    return config
  },
  err => {
    return Promise.reject(err)
  }
)
// http response 拦截器
axios.interceptors.response.use(
  response => {
    tryHideFullScreenLoading()
    return response
  },
  error => {
    // tryHideFullScreenLoading()
    return Promise.reject(error)
  }
)

vantUi:

let loading;
var clearSettimeout;
function startLoading() {
  clearSettimeout = setInterval(function() {
    loading = Toast.loading({
      message: "加载中...",
      forbidClick: true,
      duration: 0
    });
  }, 600);
}

function endLoading() {
  clearTimeout(clearSettimeout);
  clearSettimeout = null;
  Toast.clear();
}
// loading互不冲突调用
let needLoadingRequestCount = 0;

export function showFullScreenLoading() {
  if (needLoadingRequestCount === 0) {
    startLoading();
  }
  needLoadingRequestCount++;
}

export function tryHideFullScreenLoading() {
  if (needLoadingRequestCount <= 0) return;
  needLoadingRequestCount--;
  if (needLoadingRequestCount === 0) {
    endLoading();
  }
}

// 默认超时设置
/* eslint-disable */

// axios.defaults.timeout = 60000 * 10
axios.defaults.timeout = 60000 * 2
// 相对路径设置
axios.defaults.baseURL = ''
// loading图

// http request 拦截器
axios.interceptors.request.use(
  config => {
    // 设置参数格式
    if (!config.headers['Content-Type']) {
      config.headers = {
        'Content-Type': 'application/json'
      }
    }
    // 设置token 
    // // 非登录需要token
    // if( !config.url == process.env.VUE_APP_URL+'/home'){
    //   if(Cookie.get("token")){
    //       config.data.token = Cookie.get("token")
    //   }else{
    //     router.push({ name: "Home" });
    //   }
    // }
    // 判断ie加时间戳防止不请求接口
    if (window.ActiveXObject || 'ActiveXObject' in window) {
      config.url = `${config.url}?time=${new Date().getTime()}`
    }
    showFullScreenLoading()
    return config
  },
  err => {
    return Promise.reject(err)
  }
)
// http response 拦截器
axios.interceptors.response.use(
  response => {
    // window.console.log(response)
    tryHideFullScreenLoading()
    return response
  },
  error => {
    tryHideFullScreenLoading()
    return Promise.reject(error)
  }
)

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值