react 如何强制刷新组件

使用 key 属性强制重新渲染

通过修改组件的 key 属性，React 会将其视为新组件并重新挂载。例如：

const [key, setKey] = useState(0);  
const refreshComponent = () => setKey(prevKey => prevKey + 1);  

return <MyComponent key={key} />;

调用 forceUpdate 方法（不推荐）

类组件中可通过 this.forceUpdate() 强制触发渲染，但应优先依赖状态或属性驱动更新。

class MyComponent extends React.Component {
  handleRefresh = () => this.forceUpdate();
}

依赖状态更新触发渲染

通过修改与组件关联的状态变量（如 useState 或 useReducer），自然触发重新渲染：

const [refreshFlag, setRefreshFlag] = useState(false);  
const refreshComponent = () => setRefreshFlag(prev => !prev);  

使用 useEffect 监听外部变化

结合依赖项数组，当外部数据变化时自动刷新组件：

useEffect(() => { /* 重新获取数据或执行操作 */ }, [externalDependency]);