在 react.js 中加载 DOM 时的回调 [英] Callback when DOM is loaded in react.js
问题描述
当我的 react.js 组件的 DOM 元素(包括所有子节点)实际加载到页面上并准备就绪时，我希望在我的 react.js 组件上调用回调.具体来说，我有两个组件要渲染相同的大小，选择具有较大自然大小的组件中的最大值.
I want to have a callback invoked on my react.js component when it's DOM element (including all child nodes) is actually loaded on the page and ready. Specifically, I have two components that I want to render the same size, choosing the maximum of whichever component has the larger natural size.
看起来 componentDidMount 并不是我真正想要的，因为它只被每个组件调用一次，但我希望在组件完成渲染时再次调用我的回调.我以为我可以将 onLoad 事件添加到顶级 DOM 元素，但我想这仅适用于某些元素，例如 <body> 和 <img>.
It looks like componentDidMount is not really what I want because it is only called once per component, but I want my callback to be called again anytime the component is finished rendering. I thought I could add an onLoad event to the top level DOM element, but I guess that only applies for certain elements, like <body> and <img>.
推荐答案
看起来 componentDidMount 和 componentDidUpdate 的组合可以完成工作.第一个在初始渲染后调用，当 DOM 可用时，第二个在任何后续渲染后调用，一旦更新的 DOM 可用.就我而言，我都让它们委托给一个共同的函数来做同样的事情.
Looks like a combination of componentDidMount and componentDidUpdate will get the job done. The first is called after the initial rendering, when the DOM is available, the second is called after any subsequent renderings, once the updated DOM is available. In my case, I both have them delegate to a common function to do the same thing.
这篇关于在 react.js 中加载 DOM 时的回调的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
