如何通过axios + react正确使用interceptorce

npm install axios
npm install react

import axios from 'axios';

const api = axios.create({
  baseURL: 'https://api.example.com', // 设置请求的基础URL
  timeout: 5000, // 设置请求超时时间
});

export default api;

import React, { useEffect } from 'react';
import api from './api';

const MyComponent = () => {
  useEffect(() => {
    api.get('/data')
      .then(response => {
        console.log(response.data);
      })
      .catch(error => {
        console.error(error);
      });
  }, []);

  return <div>My Component</div>;
};

export default MyComponent;

import axios from 'axios';

const api = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 5000,
});

// 请求拦截器
api.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    console.log('请求拦截器');
    return config;
  },
  error => {
    // 对请求错误做些什么
    console.error('请求拦截器错误', error);
    return Promise.reject(error);
  }
);

// 响应拦截器
api.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    console.log('响应拦截器');
    return response;
  },
  error => {
    // 对响应错误做些什么
    console.error('响应拦截器错误', error);
    return Promise.reject(error);
  }
);

export default api;