react如何更新
React 更新方法
React 提供了多种方式来更新组件状态或触发重新渲染，以下是常见的方法：
使用 useState Hook 更新状态
const [count, setCount] = useState(0);
setCount(count + 1); // 直接更新
setCount(prevCount => prevCount + 1); // 函数式更新使用 useReducer 管理复杂状态
const [state, dispatch] = useReducer(reducer, initialState);
dispatch({ type: 'INCREMENT' }); // 触发更新强制重新渲染
const [, forceUpdate] = useReducer(x => x + 1, 0);
forceUpdate(); // 强制组件重新渲染类组件中的 setState
this.setState({ count: this.state.count + 1 });
this.setState(prevState => ({ count: prevState.count + 1 }));使用 Context 触发更新
const value = useContext(MyContext);
// Provider 的 value 变化时，消费该 Context 的组件会重新渲染使用 useEffect 处理副作用
useEffect(() => {
// 依赖项变化时执行
}, [dependency]);优化更新性能
const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);
const memoizedCallback = useCallback(() => { doSomething(a, b); }, [a, b]);外部状态管理 与 Redux、MobX 等状态管理库集成，通过它们的机制触发更新。
注意事项
- 避免直接修改状态对象，总是返回新对象
- 批量更新会自动处理，无需手动优化
- 函数式更新在依赖旧状态时更可靠
- 使用 React DevTools 分析不必要的重新渲染
