Выбор ответа Junior Архитектура состояния обновлено
Копирование пропсов в state
Вопрос
Почему при смене initialName у родителя поле ввода показывает старое значение?
function NameField({ initialName }: { initialName: string }) {
const [name, setName] = useState(initialName);
return <input value={name} onChange={e => setName(e.target.value)} />;
}
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: useState берёт аргумент только при первом рендере. Начальное значение useState читается один раз при монтировании.
Варианты ответа
- React кеширует пропсы до размонтирования компонента
- Нужно обернуть компонент в
memo, чтобы он увидел новый пропс useStateберёт аргумент только при первом рендереправильный ответ- Пропсы строкового типа неизменяемы и не обновляются
Разбор
Начальное значение useState читается один раз при монтировании. Если нужно сбросить состояние при смене сущности, передают key={userId}, чтобы компонент смонтировался заново, или делают компонент контролируемым. React пропсы не кеширует. memo только пропускает рендеры, проблему не решит. Неизменяемость строк тут ни при чём.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.