reactjs - componentDidUpdate 是否在所有子项更新后运行?

标签 reactjs

我想知道 React 组件的生命周期方法 componentDidUpdate 是否在所有子组件的 render 方法完成后执行,或者在 render 调用该组件的方法。

由于协调器递归地调用 render 方法来更新 View ,我有预感 componentDidUpdate 在组件的所有子组件重新渲染后执行,但是documentation 中没有足够的信息。 componentDidUpdate 到底什么时候被调用?

最佳答案

组件的render方法执行完毕后,会调用componentDidUpdate方法。这意味着它将在所有子级的 render 方法完成后调用。您链接的文档中暗示了这一点:

Use this as an opportunity to operate on the DOM when the component has been updated.

该组件仅在渲染后更新,因此文档暗示它是在所有子级以及父级完成重新渲染后调用的(尽管 a bit unclear )。只有当 DOM 完成更新(包括子元素和所有元素)时,您才能真正对其进行操作。

例如,假设我们有两个组件,AB,并且 B 呈现一个 A 组件。仅当 Brender 完成后才会调用 BcomponentDidUpdateBrender 将在成功调用 Arender 后完成,因为子级由于被渲染而首先渲染。 parent 的一部分。这意味着您的问题的答案是:componentDidUpdate 在所有子级的 render 完成后执行。

关于reactjs - componentDidUpdate 是否在所有子项更新后运行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42916045/

相关文章:

javascript - Next.js 在组件内获取数据的最佳实践

javascript - Uploadcare 上传图像输入未使用 Meteor 显示

reactjs - React.Component 和 Component 有什么区别?

javascript - 如何在映射并将 onClick 函数作为 Prop 传递后定位特定元素

javascript - 如果我没有向 URL 提供参数值,如何呈现 Page Not Found.js?

javascript - 在 JS 中使用 reduce 方法重命名对象中的键

javascript - 链接转到最后滚动位置而不是 anchor

javascript - 当 mapStateToProps 中收到另一个 prop 时更新 prop

reactjs - 如何更改无用的重复路线

reactjs - 如何在 React 中的 onblur 事件之后检查组件是否已被单击