DOM и React Senior Ref и DOM обновлено
Ссылка на методы компонента
Условие
Input должен отдавать родителю методы focus() и clear() через ref. Внутреннее поле наружу не отдавать.
Что проверяют тесты
методы доступны
focus работает
clear очищает
сам узел наружу не торчит
Как подойти
Императивный выход наружу с узким контрактом: родитель получает две функции, а не весь DOM-узел, и не может сломать внутренности. Так устроены API библиотечных инпутов и модалок. Без useImperativeHandle в ref попал бы сам элемент.
Подсказки: 3
- forwardRef пробрасывает ref внутрь компонента.
- useImperativeHandle подменяет то, что окажется в ref у родителя.
- Внутри всё равно нужен свой ref на настоящий узел.
Решите в тренажёре
Редактор с автотестами прямо в браузере. Можно решить спокойно, вслух или под таймером, как на собесе.