Когда вызывается обратный вызов React.render()?

React.render(<MyComponent/>, mainNode, function() {
    console.log('2');
});
console.log('1');

печать

2
1

Кроме того, scrollTop() в обратном вызове не работает. Он работает, если я вызываю его после возврата render().

Is React.render() синхронно?

Отображается ли DOM при возврате функции?

Когда вызывается обратный вызов? Что я хотел бы сделать в обратном вызове?

Ответы

Ответ 1

Вы можете переместить логику обратного вызова в компонент, который вы монтируете, а затем использовать метод componentDidMount в первый раз, когда компонент отображается в DOM, и componentDidUpdate для последующих обновлений/рендеринга в DOM. Компонент будет доступен в реальном DOM через window.document или с использованием метода getDOMNode компонентов в обоих этих методах.

Это не совсем то же самое, что и обратный вызов визуализации. Стоит отметить, что если вы меняете состояние компонента, вы также можете передать функцию обратного вызова методу setState для компонента, который будет применяться после обновления состояния компонентов (и любых изменений, внесенных в DOM).

Посмотрев исходный код React, чтобы подтвердить - при рендеринге нового корневого узла (в соответствии с вашим фрагментом кода) в DOM процесс синхронный, и обратный вызов (если он передан) запускается сразу после (https://github.com/facebook/react/blob/master/src/renderers/dom/client/ReactMount.js строки 570-582)