调试反应组件重新渲染

我正在尝试调试一个极少出现的bug(几十次尝试才出现一次)。

我在 render 电话,并想从那里了解尽可能多的信息。

  • 是什么原因导致了Rerender: forceUpdate, setStateprops 变了?
  • 如果是一个 props 变动,哪个组件启动了重新渲染链。我的意思不是指父级渲染的事实,而是指父级链中最上面的组件,它使用了 setStateforceUpdate 所以造成了自身和整个树的reerender(包括我现在所在的组件)。

保证所有的组件都是类组件(不是功能组件),我使用的是react 16.4.2,包括废弃的生命周期方法(如果重要的话)。还有一些上下文的用法。

我怎样才能使它?注意,我问的是调试技术,而不是修复我的具体bug。

解决方案:

如果你的组件是一个纯粹的组件 – extends React.PureComponent { ... }你其实不必在意整个重渲染链,因为只有当道具发生变化时,它才会重渲染(从链或从redux商店)。

如果父级状态发生了变化,或者父级基本上已经重新渲染了,它就不会重新渲染。

但是如果道具发生了变化,它仍然会重新渲染–就像我上面提到的那样。 状况 里面 该组件被更新或 forceUpdate 函数被调用。

如果你没有调用 forceUpdate 或者您没有更新状态,那么您的组件中的 发出 可能与道具有关。

您可以使用e.g. componentDidUpdate 和简单的比较 prevPropsthis.props 并检查哪一个道具发生了变化。

不过,您也可以查看 https:/www.npmjs.compackage@welldon-softwarewhy-did-you-render。 包,也许对你有帮助。

给TA打赏
共{{data.count}}人
人已打赏
未分类

如何打印涉及indexOf()方法的字母?注意:应该打印一个字母,而不是索引位置[重复]。

2022-9-8 11:00:36

未分类

谷歌云任务。在预定的ETA之前运行一个任务。

2022-9-8 11:00:38

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索