如何在Axios中编写条件拦截器

时间:2019-11-27 18:36:44

标签: axios

我能够为Axios管道添加一个拦截器。另外,我需要加载器是基于条件的。情况是某些请求可以在后台运行,而无需加载程序来阻止UI。在这种情况下,我可以通过发送一个额外的参数isBackground调用来通知Axios。我该如何实现?

      axios.interceptors.request.use((config) => {
            this.isLoading = true; // Or trigger start loader
            return config
        }, (error) => {
            this.isLoading = false  // Or trigger stoploader
            return Promise.reject(error)
        })

        axios.interceptors.response.use((response) => {
            this.isLoading = false    // Or trigger stoploader
            return response
        }, function(error) {
            this.isLoading = false   // Or trigger stoploader
            return Promise.reject(error)
        })

1 个答案:

答案 0 :(得分:1)

只需在配置上使用您自己的自定义属性isBackground,如下所示:

  axios.interceptors.request.use((config) => {
    console.log(config.isBackground)
    return config
  }, (error) => {
    console.log(error.config.isBackground)
    return Promise.reject(error)
  })

  axios.interceptors.response.use((response) => {
    console.log(response.config.isBackground)
    return response
  }, function(error) {
    console.log(error.config.isBackground)
    return Promise.reject(error)
  })

  const config = {
    isBackground: true
  }

    axios.get('https://httpbin.org/get', config)
    .then(response => {
        console.log(response)
    })
    .catch(error => {
        console.log(error)
    })

请注意,当前版本0.19.0中有一个bug有待修复,这破坏了此功能。在0.18版中可以正常使用...

Fiddle