Есть контролируемый инпут для ввода телефона.
Но дефолтное значение приходит сверху, если оно существует.
Проблема - в таком варианте значение подставляется только после обновления компонента.
Если я в 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
