Установка значения false для свойства bool в состоянии реакции ничего не делает - PullRequest
0 голосов
/ 30 апреля 2018

Здравствуйте, ребята, у меня небольшая логическая проблема с одним из моих компонентов, сейчас я использую реагирующий переключатель

        <Switch
            onChange={e => this.handleSwitch(e, 'spaces', 'living')}
            checked={this.state.dwelling.spaces.living === undefined ? true : this.state.dwelling.spaces.living}
            id="normal-switch"
            onColor="#86d3ff"
            onHandleColor="#2693e6"
            handleDiameter={20}
            uncheckedIcon={false}
            checkedIcon={false}
            boxShadow="0px 1px 5px rgba(0, 0, 0, 0.6)"
            activeBoxShadow="0px 0px 1px 10px rgba(0, 0, 0, 0.2)"
            height={15}
            width={38}
            className="react-switch"
        />

, поэтому в этой первой части я пытаюсь установить по умолчанию истинное значение для флажка, затем приходит обработчик,

 handleSwitch(e, type, subtype) {
    this.setState(
        state => ({
            dwelling: {
                ...state.dwelling,
                [type]: {...state.dwelling[type], [subtype]: e}
            }
        })
    );
    console.log(this.state.dwelling.spaces);
}

по какой-то причине при первом нажатии на переключатель, мой объект состояния не изменился, но переключатель выключен, 2-й щелчок переключается, и состояние в значении FALSE 3-й щелчок выключается и состояние в истинное значение Я действительно смущен результатами.

1 Ответ

0 голосов
/ 03 мая 2018

Как упоминалось в комментариях, console.log считывает старые значения, если оно находится за пределами setState - если вы поместите его внутри этой функции, оно будет работать нормально.

но почему это? Ну, потому что обновления состояния могут быть асинхронными (и реакция может даже пакетно обновлять несколько пакетов), что заставляет вас видеть старое состояние

...