S jakými hooky jste pracoval ve funkčních komponentách? Který byl nejneobvyklejší?

Ve funkčních komponentách React se často používají následující hooky:

• useState — pro správu stavu.
• useEffect — pro vedlejší efekty (dotazy, odběry).
• useContext — pro přístup ke kontextu.
• useRef — pro ukládání proměnných, které se nemění při renderu, a přístup k DOM.
• useMemo a useCallback — pro optimalizaci výkonu.

Nejneobvyklejší hook, se kterým jsem pracoval, může být useImperativeHandle. Umožňuje nakonfigurovat instanci, která bude dostupná rodičovskému komponentu přes ref. To je užitečné, když je potřeba kontrolovat, které metody nebo vlastnosti jsou přístupné zvenčí, zejména při práci s obaly nad DOM elementy nebo třetími knihovnami.

Příklad použití useImperativeHandle:

import React, { useImperativeHandle, forwardRef, useRef } from 'react';

const FancyInput = forwardRef((props, ref) => {
  const inputRef = useRef();

  useImperativeHandle(ref, () => ({
    focus: () => {
      inputRef.current.focus();
    }
  }));

  return <input ref={inputRef} {...props} />;
});

// Rodičovský komponent může zavolat metodu focus:
// const ref = React.createRef();
// <FancyInput ref={ref} />
// ref.current.focus();