源代码中
const targetQuery = {
...initialStateRef.current,
...queryFromUrl,
} as state;
const setState = (s: React.SetStateAction<state>, options?: Options) => {
const newQuery = typeof s === 'function' ? (s as Function)(targetQuery) : s;
const navigateMode = options?.navigateMode ?? 'push';
// 1. 如果 setState 后,search 没变化,就需要 update 来触发一次更新。比如 demo1 直接点击 clear,就需要 update 来触发更新。
// 2. update 和 history 的更新会合并,不会造成多次更新
update((v) => !v);
history[navigateMode]({
hash: location.hash,
search: stringify({ ...queryFromUrl, ...newQuery }, parseConfig) || '?',
});
};
这部分在每次重渲染时就是新值,从而造成的影响就是
每次重渲染,这两个值就变化,导致触发其他useEffect(重复触发,且无意义)
但是预期实际是
- targetQuery 只有query变化时才是新值
- setState 永远都是固定引用
1条答案
按热度按时间zlwx9yxi1#
还有
源代码中
会造成一种情况,如果用户同时调用多个setQuery,就会导致其中某个的值是旧的
因为
queryFromUrl
是useMemo而不是每次直接从query中获取