@lexstile

Как засетить пропсы в стейт и нужно ли это делать?

Есть контролируемый инпут для ввода телефона.
Но дефолтное значение приходит сверху, если оно существует.

Проблема - в таком варианте значение подставляется только после обновления компонента.

Если я в defaultValue у инпута подставлю phone, все отработает, как нужно.
Но если я его кладу в useState, чтобы одна переменная отвечала за значение, при монтировании значение не подставляется.
export const ModalPhoneConfirmation = ({ id, phone, onCloseModal }) => {

  const [phoneValue, setPhoneValue] = useState(phone);

// ..........................................

Инпут:
<Input
                type="phone"
                defaultValue={phoneValue}
                placeholder="Введите телефон"
                onChange={onChangePhoneValue}
              />


UPD: Нашел две проблемы в данном коде
1. Дефолтное значение state присваивается только один раз
2. У defautValue +/- то же самое, обновляет DOM только раз

Пока сделал через useEffect, если кто-то предложит решение лучше, буду благодарен
useEffect(() => setPhoneValue(phone), [phone]);
// ну и defaultValue заменил на value
  • Вопрос задан
  • 44 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы