react如何触发更新

触发 React 组件更新的方法

状态更新（State Update）
通过 useState 或 this.setState 修改组件的状态。状态变化会自动触发组件的重新渲染。

const [count, setCount] = useState(0);
setCount(count + 1); // 触发更新

Props 变化
父组件传递的 props 发生变更时，子组件会重新渲染。确保父组件更新 props 值即可触发子组件更新。

<ChildComponent newProp={updatedValue} />

Context 变更
当使用 useContext 或 Context.Consumer 订阅的 Context 值发生变化时，组件会重新渲染。

const value = useContext(MyContext); // Context 更新时触发

强制更新（Force Update）
类组件中可通过 this.forceUpdate() 强制重新渲染，但应尽量避免使用。函数组件无直接等效方法，通常通过状态或 key 变更实现类似效果。

this.forceUpdate(); // 类组件强制更新

Key 属性变更
为组件设置 key 属性并改变其值，React 会将其视为新组件，触发卸载和重新挂载。

<ListItem key={item.id} /> // 修改 key 触发重建

Redux 或状态管理库更新
当连接的 Redux store 或其他状态管理库（如 MobX、Zustand）的状态变化时，订阅该状态的组件会自动更新。

const state = useSelector((state) => state.value); // Redux 更新时触发

注意事项

• 避免不必要的更新：使用 React.memo、useMemo 或 useCallback 优化性能。
• 副作用控制：在 useEffect 或生命周期方法中谨慎处理更新逻辑，防止无限循环。