I ran into the same problem.
In most scenarios using the hack-ish setTimeout(() => { }, 0)
in componentDidMount()
worked.
But not in a special case; and I didn't want to use the ReachDOM findDOMNode
since the documentation says:
Note: findDOMNode is an escape hatch used to access the underlying DOM node. In most cases, use of this escape hatch is discouraged because it pierces the component abstraction.
(Source: findDOMNode)
So in that particular component I had to use the componentDidUpdate()
event, so my code ended up being like this:
componentDidMount() {
// feel this a little hacky? check this: http://stackoverflow.com/questions/26556436/react-after-render-code
setTimeout(() => {
window.addEventListener("resize", this.updateDimensions.bind(this));
this.updateDimensions();
}, 0);
}
And then:
componentDidUpdate() {
this.updateDimensions();
}
Finally, in my case, I had to remove the listener created in componentDidMount
:
componentWillUnmount() {
window.removeEventListener("resize", this.updateDimensions.bind(this));
}