Vue axios 路由拦截增加进度条功能，另外拦截器可以进行token验证

网上都有资料，自己做下记录

<template>
  <div>
    <div>内容</div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'Interceptor',
  created () {
    let instacePhone = axios.create({
      baseURL: 'http://api.dev.test/api',
      timeout: 2000
    })
    // 请求拦截器
    instacePhone.interceptors.request.use(config => {
      this.loadingIf = true
      this.$nprogress.start()
      return config
    }, error => {
      return Promise.reject(error)
    })
    // 响应拦截器
    instacePhone.interceptors.response.use(res => {
      this.$nprogress.done()
      return res
    }, error => {
      // this.$nprogress.done()
      return Promise.reject(error)
    })
    //
    instacePhone.get('/version').then((res) => {
      console.log('请求拦截器')
      console.log(res)
    })
  },
  data () {
    return {
      loadingIf: false,
      percentage: 0
    }
  }
}
</script>

<style scoped>

</style>