ню, как удивился, когда узнал, чтоsetState был асинхронным Теперь я наткнулся на «странное» поведение, которое не вписывается в мое пониманиеsetState асинхронность.

Рассмотрим фрагмент ниже (по некоторым причинам это приводит кScript ErrorВот внешняя песочница:https://codesandbox.io/s/zwrvkz74y3):

class SomeComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      prop1: 1,
      prop2: 2
    };

    setTimeout(this.changeProp1.bind(this), 100);
  }

  componentDidUpdate() {
    console.info("componentDidUpdate called");
  }

  changeProp1() {
    this.setState({ prop1: 2 });
    this.changeProp2();
  }

  changeProp2() {
    this.setState({ prop2: 3 });
  }

  render() {
    const { prop1, prop2 } = this.state;
    return React.createElement('div', null, `prop1: ${prop1}, prop2: ${prop2}`);
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(React.createElement(SomeComponent), rootElement);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

Если вы запустите это и проверите консоль, вы увидите, чтоcomponentDidUpdate был вызван дважды, но не долженsetStates накапливать и обновлять компонент только один раз?

ОБНОВИТЬЯ думаю, что моя путаница происходит от этой фразы вОбновления состояния могут быть асинхронными раздел на сайте ReactJS:

React может объединять несколько вызовов setState () в одно обновление для повышения производительности.