Sobes.tech
Middle

С кои хукове сте работили във функционални компоненти? Кой беше най-необичаен?

sobes.tech AI

Отговор от AI

В функционалните компоненти на React често се използват следните hooks:

  • useState — за управление на състоянието.
  • useEffect — за странични ефекти (заявки, абонаменти).
  • useContext — за достъп до контекста.
  • useRef — за съхраняване на променливи и достъп до DOM.
  • useMemo и useCallback — за оптимизация на производителността.

Най-необичайният hook, с който съм работил, може да бъде useImperativeHandle. Той позволява да конфигурирате инстанция, която ще бъде достъпна за родителския компонент чрез ref. Това е полезно, когато трябва да контролирате кои методи или свойства са достъпни отвън, особено при работа с обвивки над DOM елементи или външни библиотеки.

Пример за използване на 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} />;
});

// Родителският компонент може да извика метода focus:
// const ref = React.createRef();
// <FancyInput ref={ref} />
// ref.current.focus();