// входные параметры: // url // options export function useFetch() { // логика const fetchData = async () => {}; return { data, error, loading }; }

Вот пример реализации кастомного хука useFetch, который принимает URL и опции запроса, и возвращает состояние загрузки, данные и ошибку:

import { useState, useEffect } from 'react';

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

  useEffect(() => {
    if (!url) return;

    const controller = new AbortController();
    const signal = controller.signal;

    const fetchData = async () => {
      setLoading(true);
      setError(null);
      try {
        const response = await fetch(url, { ...options, signal });
        if (!response.ok) {
          throw new Error(`Ошибка: ${response.status}`);
        }
        const json = await response.json();
        setData(json);
      } catch (err) {
        if (err.name !== 'AbortError') {
          setError(err.message);
        }
      } finally {
        setLoading(false);
      }
    };

    fetchData();

    return () => {
      controller.abort();
    };
  }, [url, JSON.stringify(options)]);

  return { data, error, loading };
}

Этот хук автоматически запускает запрос при изменении url или options, обрабатывает состояние загрузки, ошибки и данные, а также отменяет запрос при размонтировании компонента или изменении параметров.