useFetch

import {
    
     useState, useEffect } from "react";

const useFetch = (url = "", options = undefined) => {
    
    
  const [data, setData] = useState(null);
  const [error, setError] = useState(null);
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    
    
    let isMounted = true;

    setLoading(true);

    fetch(url, options)
      .then((res) => res.json())
      .then((data) => {
    
    
        if (isMounted) {
    
    
          setData(data);
          setError(null);
        }
      })
      .catch((error) => {
    
    
        if (isMounted) {
    
    
          setError(error);
          setData(null);
        }
      })
      .finally(() => isMounted && setLoading(false));

    return () => {
    
    
      isMounted = false;
    };
  }, [url, options]);

  return {
    
     loading, error, data };
};

export default useFetch;

猜你喜欢

转载自blog.csdn.net/printf_hello/article/details/113976396