react如何去除记忆
移除 React 组件中的记忆化
使用 React.memo 或 useMemo/useCallback 会缓存组件或计算结果。若需取消记忆化，直接移除相关包装或钩子即可。
类组件：删除 React.memo 高阶组件包装。
// 记忆化版本
const MemoizedComponent = React.memo(MyComponent);
// 非记忆化版本
const PlainComponent = MyComponent;函数组件：移除 useMemo 或 useCallback，改用普通变量或函数。
// 记忆化版本
const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);
// 非记忆化版本
const plainValue = computeExpensiveValue(a, b);避免状态记忆导致的问题
若需组件状态在每次渲染时重置，可通过以下方式实现：
-
使用
key属性：改变key会强制 React 重新挂载组件。<MyComponent key={uniqueId} /> -
在父组件中控制状态：将状态提升到父组件，通过
props传递，确保子组件随父组件更新。
清除自定义 Hook 中的缓存
自定义 Hook 若使用了缓存逻辑（如 useRef 存储旧值），需手动重置引用或依赖项。
function useNonMemoizedHook(dep) {
const ref = useRef(null);
// 每次依赖变化时强制更新
ref.current = calculateValue(dep);
return ref.current;
}禁用 React 18 自动批处理
React 18 默认自动批处理状态更新以优化性能。若需立即更新状态，可使用 flushSync（谨慎使用）。
import { flushSync } from 'react-dom';
flushSync(() => {
setState(newValue); // 同步更新
});通过以上方法，可以灵活控制 React 中的记忆化行为。
