react 封装axios请求

React 封装 Axios 请求可以通过创建一个自定义的 Hook 来实现。下面是一个简单的例子：

import { useState, useEffect } from "react";
import axios from "axios";

const useAxios = (url) => {
  const [data, setData] = useState(null);
  const [isLoading, setIsLoading] = useState(false);
  const [error, setError] = useState(null);

  useEffect(() => {
    const fetchData = async () => {
      setIsLoading(true);
      try {
        const response = await axios.get(url);
        setData(response.data);
      } catch (error) {
        setError(error);
      }
      setIsLoading(false);
    };
    fetchData();
  }, [url]);

  return { data, isLoading, error };
};

export default useAxios;

上面的代码中，useState 用来存储请求结果和错误信息，useEffect 用来发送请求并更新状态。最后，useAxios Hook 返回一个包含请求结果和状态的对象，供其他组件使用。使用时，只需调用 useAxios(url) 即可。