Как React batch setState подходит для смешивания объекта и обратного вызова? - PullRequest
Новая
       6

Как React batch setState подходит для смешивания объекта и обратного вызова?

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

В соответствии с документацией Реагирует пакет setState, если ему предоставляется обратный вызов 

this.setState(prevState => {value: prevState + 1 })

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

reset() {
  this.setState(prevState => ({value: prevState.initialValue}));
  this.setState({initialValue: null});
}

Поскольку нам не нужен доступ к значениям состояния во втором setState, нам не нужно использовать функциональный setState. В этой ситуации React все еще пакетирует функционал setState в более поздний момент времени (и потенциально выполняет объект setState первым)? Или это будет поддерживать порядок исполнения?

1 Ответ

0 голосов
/ 26 марта 2019

И setState с аргументом функции (updater) и с аргументом объекта будут применять изменения к объекту состояния синхронно. Дело в том, что он применяет изменения не к объекту this.state, а к ожидающему объекту «следующий» (это моя терминология, а не из документов). И updater дает нам возможность получить доступ к этому ожидающему «следующему» состоянию, которое мы обновляем.

Рассмотрим этот пример: 

// this.state.value === 0
this.setState({ value: this.state.value + 1 });
// pendingState.value === 1
this.setState(pendingState => ({ value: pendingState.value + 1 }));
// pendingState.value === 2
this.setState(pendingState => ({ value: pendingState.value + 2 }));
// pendingState.value === 4
this.setState({ value: this.state.value + 1 });
// pendingState.value === 1

Надеюсь, это поможет. Тот же пример в codeandbox: https://codesandbox.io/s/2p6j2mxnyj

...