react如何触发更新
React 触发更新的方法
React 的更新机制依赖于状态（state）和属性（props）的变化。以下是触发 React 组件更新的常见方法：
使用 useState 或 useReducer 更新状态
通过调用 useState 返回的 setter 函数或 useReducer 返回的 dispatch 函数，可以触发组件的重新渲染。
const [count, setCount] = useState(0);
setCount(count + 1); // 触发更新通过父组件传递新的 props
当父组件重新渲染并传递新的 props 时，子组件会触发更新。
function Parent() {
const [value, setValue] = useState('');
return <Child value={value} />;
}使用 forceUpdate 强制更新
在类组件中，可以通过调用 this.forceUpdate() 强制触发渲染，但应尽量避免使用。
class MyComponent extends React.Component {
handleClick = () => {
this.forceUpdate();
};
}使用 Context API 更新
当 Context 的 value 发生变化时，所有消费该 Context 的组件会触发更新。
const MyContext = React.createContext();
function Provider() {
const [data, setData] = useState({});
return (
<MyContext.Provider value={{ data, setData }}>
<Consumer />
</MyContext.Provider>
);
}使用外部状态管理库
如 Redux、MobX 等库的状态变化会触发 React 组件的更新。
const store = useSelector(state => state.store);
// 当 Redux store 更新时，组件重新渲染通过 useEffect 依赖项触发
useEffect 的依赖项变化会触发副作用，进而可能间接导致组件更新。
useEffect(() => {
// 副作用逻辑
}, [deps]); // deps 变化时触发注意事项
- 避免不必要的更新，可以通过
React.memo、useMemo或useCallback优化性能。 - 函数组件中无法直接使用
forceUpdate，可以通过自定义 hook 模拟类似行为。
