Възможно ли е във функционален компонент да се предостави външен достъп до методите на компонента (да се дадат 'дръжки' навън)?

В функционалните компоненти на React може да се предостави външен достъп до методите на компонента чрез forwardRef и useImperativeHandle.

Това позволява да се 'прехвърли' референция и да се определи кои методи или свойства ще бъдат достъпни отвън.

Пример:

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

const MyComponent = forwardRef((props, ref) => {
  const [count, setCount] = useState(0);

  useImperativeHandle(ref, () => ({
    increment() {
      setCount(c => c + 1);
    },
    reset() {
      setCount(0);
    }
  }));

  return <div>Брояч: {count}</div>;
});

// Използване
// const ref = React.createRef();
// <MyComponent ref={ref} />
// ref.current.increment();

По този начин, външният код може да извиква методите increment и reset на компонента.