Самописный хук useRef

Условие

Создать собственную реализацию хука useRef, имитируя его поведение в React. Необходимо написать функцию, которая возвращает объект с полем current, позволяющим сохранять mutable значение между рендерами без его повторного вычисления. При вызове хука должен быть обеспечен постоянный объект‑референс на протяжении всего жизненного цикла компонента.

Требования:

• Функция должна работать без использования готового useRef из библиотеки React.
• Возвращаемый объект должен иметь свойство current, которое можно читать и изменять.
• При повторных вызовах в рамках одного компонента ссылка на объект должна оставаться неизменной.
• Реализацию можно протестировать в простом функциональном компоненте, проверяя, что значение сохраняется между рендерами.

Пример использования (для иллюстрации, код менять не нужно):

function MyComponent() {
  const ref = useMyRef(0);
  // ...
}

Ответ

Можно сохранить объект через ленивый useState и не использовать setter. Тогда current изменяется без ререндера, а ссылка сохраняется в экземпляре компонента.

import { useState } from 'react';
function useMyRef(initialValue) {
  const [ref] = useState(() => ({ current: initialValue }));
  return ref;
}

Это имитация наблюдаемого поведения на базе другого React-хука, не самостоятельная реализация React. Выражение аргумента вызывающий код всё равно вычисляет при каждом рендере. Не используйте изменяемый current вместо state для данных отображения.