Само изменение ref.current не вызывает рендер, поэтому число на экране не обязано измениться после клика. Ref подходит для изменяемых служебных данных, не требующих обновления UI.
Вызывает ли изменение React ref повторный рендер?
Само изменение ref.current не вызывает рендер, поэтому число на экране не обязано измениться после клика. Ref подходит для изменяемых служебных данных, не требующих обновления UI.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
Компонент создаёт const value=useRef(0) и выводит value.current в JSX. Кнопка делает value.current++. Другого изменения state нет. Как часто обновится видимое число и зачем тогда нужен ref?
Ответ
Само изменение ref.current не вызывает рендер, поэтому число на экране не обязано измениться после клика. Ref подходит для изменяемых служебных данных, не требующих обновления UI.
Например, в ref хранят идентификатор таймера или DOM-узел. Для отображаемого счётчика используют useState. Если позже произойдёт другой рендер, JSX может прочитать уже изменённое current, но полагаться на такой случайный повод нельзя. Это объяснение относится к объекту useRef; lifecycle callback-ref для DOM имеет отдельную семантику.
Источник: react.dev.