是否有系统的方法来调试导致组件在React中重新呈现的原因？我放了一个简单的console.log（）来查看它渲染了多少次，但是我很难找出是什么导致组件渲染多次，在我的例子中是（4次）。是否存在显示时间线和/或所有组件树渲染和顺序的工具
如果您想要一个没有任何外部依赖关系的短代码段，我觉得这很有用
组件更新（prevProps，prevState）{
Object.entries（this.props）.forEach（（[key，val]）=>；
prevProps[key]！==val&；amp；console.log（`Prop’${key}’已更改`）
);
如果（本州）{
Object.entries（this.state）.forEach（（[key，val]）=>；
prevState[key]！==val&；amp；console.log（`State’${key}’已更改`）
);
}
}
这里有一个小钩子，我用来跟踪函数组件的更新
函数使用跟踪更新（道具）{
const prev=useRef（道具）；
使用效果（（）=>{
const changedrops=Object.entries（props）.reduce（（ps[k，v]）=>{
如果（上一个当前[k]！==v）{
ps[k]=[上一个当前[k]，v]；
}
返回ps；
}, {});
if（Object.keys（changedProps）.length>；0）{
log（'changedProps:'，changedProps）；
}
prev.current=道具；
});
}
//用法
功能MyComponent（道具）{
使用跟踪更新（道具）；
return<；div>；{props.children}<；/div>；；
}