BFE.devでのAI解答例 - React コーディング問題
2. useTimeout()

import { useEffect, useRef } from 'react';

const useTimeout = (callback, delay) => {
  const savedCallback = useRef(callback);
  const timeoutId = useRef(null);

  useEffect(() => {
    savedCallback.current = callback;
  }, [callback]);

  useEffect(() => {
    if (timeoutId.current) {
      clearTimeout(timeoutId.current);
    }

    timeoutId.current = setTimeout(() => savedCallback.current(), delay);

    return () => {
      clearTimeout(timeoutId.current);
    };
  }, [delay]);

  return timeoutId.current;
};

export default useTimeout;

Usage:

import React from 'react';
import useTimeout from './useTimeout';

const MyComponent = () => {
  const [count, setCount] = React.useState(0);

  useTimeout(() => {
    setCount(count + 1);
  }, 5000);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>Increment</button>
    </div>
  );
};