Junior — Middle
108
Können Sie erklären, wie die Verwendung von useRef in React implementiert ist und wofür sie dient?
Antwort von AI
sobes.tech KI
В React хук useRef используется для создания изменяемого объекта, который сохраняет своё значение между рендерами компонента, но изменение этого значения не вызывает повторный рендер.
Основные применения useRef:
- Хранение ссылки на DOM-элемент для прямого доступа.
- Хранение любого мутируемого значения, которое нужно сохранить между рендерами без триггера обновления.
Пример использования для доступа к DOM:
import React, { useRef } from 'react';
function TextInput() {
const inputRef = useRef(null);
const focusInput = () => {
if (inputRef.current) {
inputRef.current.focus();
}
};
return (
<>
<input ref={inputRef} type="text" />
<button onClick={focusInput}>Фокус на поле</button>
</>
);
}
Здесь inputRef хранит ссылку на DOM-элемент input, что позволяет программно установить фокус.
Также useRef можно использовать для хранения любых значений, например, счетчика, который не влияет на UI.