Get notified when React tree is updated

Question

ReactDOM.render accepts an optional callback, which is executed when component is rendered:

ReactDOM.render(element, container[, callback])

Is there a similar callback in React/ReactDOM that is executed when a component in the tree (of any depth) is updated from within, i.e. using a setState?

Simply providing componentDidUpdate on the root component won't do, as the method is not triggered on children update: https://codesandbox.io/s/react-example-yjq0r
It is possible to subscribe to DOM tree updates using MutationObserver, but I wonder whether React provides this functionality out of the box.

```setState(updater[, callback])``` setState also accept a ```callback``` — Tien Duong, Jul 30 '19 at 08:39
Yes, componentDidUpdate/setState callback, but for the whole tree. — Pavlo, Jul 30 '19 at 08:42
Possible duplicate of [React: how to notify parent for changes](https://stackoverflow.com/questions/40644092/react-how-to-notify-parent-for-changes) — rdarioduarte, Jul 30 '19 at 13:53

score 2 · Accepted Answer · answered Aug 11 '19 at 13:49

2

This can be done using React.Profiler:

<React.Profiler id="app" onRender={callback}>
  <Root />
</React.Profiler>

https://codesandbox.io/s/react-example-lmvzk

answered Aug 11 '19 at 13:49

Pavlo

43,301
14
77
113

Get notified when React tree is updated

1 Answers1