能详细告诉我下vue请求拦截器如何使用吗

当我们在Vue中使用axios发送请求时，可以通过axios的拦截器来实现对请求进行拦截、处理和统一配置。具体步骤如下：

1. 在Vue项目中安装axios

npm install axios --save

2. 在main.js中配置axios

import axios from 'axios'
Vue.prototype.$http = axios.create({
  // 配置axios请求的地址
  baseURL: 'http://localhost:3000',
  timeout: 10000 // 请求超时时间
})

3. 配置请求拦截器

import axios from 'axios'
Vue.prototype.$http = axios.create({
  baseURL: 'http://localhost:3000',
  timeout: 10000
})

// 请求拦截器
Vue.prototype.$http.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    // 可以在此处添加token等请求头信息
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
)

在请求拦截器中，我们可以对请求做一些统一的处理，比如添加请求头信息、处理请求参数等。

4. 配置响应拦截器

import axios from 'axios'
Vue.prototype.$http = axios.create({
  baseURL: 'http://localhost:3000',
  timeout: 10000
})

// 请求拦截器
Vue.prototype.$http.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    // 可以在此处添加token等请求头信息
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
)

// 响应拦截器
Vue.prototype.$http.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    return response;
  },
  error => {
    // 对响应错误做些什么
    return Promise.reject(error);
  }
)

在响应拦截器中，我们可以对响应做一些统一的处理，比如对返回的数据进行格式化、处理异常情况等。

通过以上步骤，我们就可以使用Vue的axios拦截器来实现对请求和响应的统一处理。