react 重复渲染

在React中，组件的重复渲染（re-rendering）是其核心特性之一，但也可能导致性能问题，尤其是在数据更新频繁或不必要的时候。React会根据组件内部状态（state）和属性（props）的变化来决定是否重新渲染。以下是导致React组件重复渲染的一些常见原因：

1. 状态（State）更新：当你修改了组件的状态（useState或setState），React会自动触发组件的重新渲染，以便更新视图。

2. 属性（Props）改变：当父组件传递给子组件的新prop不等于之前的prop时，React也会重新渲染子组件。

3. 外部依赖（Lifecycles方法）：某些生命周期方法，如`componentDidUpdate`，可能会触发组件的更新，如果它们在其中做了可能影响视图的操作。

4. 键（Key）不正确：对于列表组件，给每个列表项提供一个唯一的key有助于React跟踪元素的变化，没有正确的key可能导致不必要的渲染。

5. 使用了`forceUpdate`或`setState`没有回调：这些方法不依赖于状态或prop的更改，而是直接通知React组件更新，因此可能导致不必要的渲染。