Обработчик планирует обновление state, React вычисляет новое дерево, затем на commit добавляет или удаляет input. Вызов setVisible не вставляет DOM-узел прямо внутри обработчика.
Что происходит при условном показе input в React
Обработчик планирует обновление state, React вычисляет новое дерево, затем на commit добавляет или удаляет input. Вызов setVisible не вставляет DOM-узел прямо внутри обработчика.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
Компонент хранит visible и выводит {visible && <input />}. Кнопка вызывает setVisible(value => !value). Опишите путь от клика до изменения DOM.
Ответ
Обработчик планирует обновление state, React вычисляет новое дерево, затем на commit добавляет или удаляет input. Вызов setVisible не вставляет DOM-узел прямо внутри обработчика.
Когда visible меняется с false на true, создаётся элемент input; при обратном переходе он размонтируется и теряет локальное несохранённое состояние. Если требуется сохранить значение, храните его отдельно или не размонтируйте элемент. Для установки фокуса дождитесь появления DOM через ref и соответствующий эффект.