@F1eX
React Dev

Почему стейт чекбокса обновляется таким образом?

Есть такой код:
const rejectedCodes = {unverifiable: {status: false, code: 3}, ...}
const [rejectedStatuses, setRejectedStatuses] = useState(rejectedCodes);

<Checkbox
   checked={rejectedStatuses.unverifiable.status}
   onChange={(e) => {
        setRejectedStatuses({
             ...rejectedStatuses,
             unverifiable: { ...rejectedStatuses.unverifiable, status: e.target.checked }
       })
       console.log(rejectedStatuses);
   }}
>
Unverifiable
</Checkbox>


При клику на этот чекбокс стейт меняется как надо, но само состояние чекбокса противоположно ему - т.е. при status: true свойство чекбокса checked равно false и наоборот.
Попытка костылить инверсией стейта, естественно, делает чекбокс некликабельным.
  • Вопрос задан
  • 86 просмотров
Решения вопроса 1
@dimoff66
Кратко о себе: Я есть
Потому что rejectedStatuses содержит состояние на момент последнего рендеринга. Оно не может измениться от вызова setRejectedStatuses ну хотя бы потому что это константа. А вы проверяете его значение немедленно после вызова функции установки, словно константа раз и поменяется. Оно поменяется при следующем вызове функции компонента, то есть после рендеринга, вызванного сменой состояния.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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