loading封装

1.支持设置loading延时出现的时间，比如接口响应很快，就没必要显示loading了，否则loading闪一下就消失了很多余
2.支持设置loading是否出现，虽然loading是封装在axios拦截器里的，但是某些接口可能不需要有loading显示
3.以服务的方式调用,引入 element ui Loading 服务
基于nuxt $axios模块，代码如下：

import { Message, Loading } from "element-ui"
export default ({ $axios, store, app, redirect, route, req, res }) => {
  let [loadingCount, currencyCode, currentLanguage, isRefreshing, token] = [
    0,
    "",
    "",
    true,
    ""
  ]
  $axios.onRequest(config => {
    // 如果请求头里设置了可显示loading，才调用showLoading
    if (!config.headers.hideLoading) {
      showLoading(config.headers.loadingTarget, config.headers.delayTime)
    }
    return config
  })
  $axios.onResponse(response => {
  if (!response.config.headers.hideLoading) {
      hideLoading()
    }
    return response
  })

  $axios.onError(error => {
    hideLoading()
    return Promise.reject(error)
  })

  let [loading, timer] = [null, null]

  // 显示loading
  function showLoading(target, delayTime) {
    if (loadingCount === 0 && !loading) {
      // loading 延迟显示的时间默认1s，可配置是否延迟显示
      if (delayTime !== false) {
        timer = setTimeout(() => {
          loading = Loading.service({
            text: "Loading...",
            background: "rgba(0, 0, 0, 0)",
            target: target || "body"
          })
        }, 1000)
      } else {
        loading = Loading.service({
          text: "Loading...",
          background: "rgba(0, 0, 0, 0)",
          target: target || "body"
        })
      }
    }
    loadingCount++
    store.commit("setShowEmpty", false)
  }

  // 隐藏loading
  function hideLoading() {
    loadingCount--
    loadingCount = Math.max(loadingCount, 0) // 做个保护
    if (loadingCount === 0) {
      if (timer) {
        clearTimeout(timer)
        timer = null
      }
      // 关闭loading
      toHideLoading()
      setTimeout(() => {
        store.commit("setShowEmpty", true)
      }, 500)
    }
  }

  // 防抖：将 300ms 间隔内的关闭 loading 便合并为一次。防止连续请求时， loading闪烁的问题。
  const toHideLoading = _.debounce(() => {
    if (loading) {
      loading.close()
    }
    loading = null
  }, 300)
}