hooks icon indicating copy to clipboard operation
hooks copied to clipboard

useRequest在严格模式StrictMode下,缓存失效

Open fred8617 opened this issue 10 months ago • 9 comments

Preview

fred8617 avatar Apr 21 '24 19:04 fred8617

Maybe you need to set it to not expire or staleTime

zhangmo8 avatar Apr 24 '24 02:04 zhangmo8

{ cacheKey: "cacheKey-share", staleTime: -1 }

zhangmo8 avatar Apr 24 '24 02:04 zhangmo8

Maybe you need to set it to not expire or staleTime

it's wried. I used official example in the Preview, why to set staleTime in strict mode? @zhangmo8

fred8617 avatar Apr 24 '24 02:04 fred8617

I don't. But it's work.

zhangmo8 avatar Apr 24 '24 02:04 zhangmo8

@zhangmo8 actually, we are not on the same page. I need refresh the datas, but if I set staleTime to -1, the refresh is invalid.

fred8617 avatar Apr 24 '24 02:04 fred8617

ok. 我知道啦...英文描述比较麻烦... 它的行为是对的,或者说在预料之中的... 你设置的请求是3s,在这3s内,数据是已经被缓存下来的,所以当点击【更新】按钮的一瞬间,它会直接读取缓存的数据,并在请求完成(3s)后更新数据,我理解这是符合预期的。

你的问题其实是在于,非严格模式下,它两个数据是同步的,而严格模式下并没有同步更新,我认为它可能是react的render策略引起的问题

语言描述比较苍白,为此,我录制了一个视频来描述这个行为。并且更改了请求时间为5s,以便你能够更好的看到它读取缓存的数据

https://github.com/alibaba/hooks/assets/43628500/074904d5-05b4-47ce-85f2-225dce1e3798

另外附上链接 Preview

zhangmo8 avatar Apr 24 '24 03:04 zhangmo8

你的问题其实是在于,非严格模式下,它两个数据是同步的,而严格模式下并没有同步更新,我认为它可能是react的render策略引起的问题

OK got it, 其实我想说的就是这个问题,如果开启StrictMode,就只能手动去refresh了

fred8617 avatar Apr 24 '24 03:04 fred8617

ok. 我知道啦...英文描述比较麻烦... 它的行为是对的,或者说在预料之中的... 你设置的请求是3s,在这3s内,数据是已经被缓存下来的,所以当点击【更新】按钮的一瞬间,它会直接读取缓存的数据,并在请求完成(3s)后更新数据,我理解这是符合预期的。

你的问题其实是在于,非严格模式下,它两个数据是同步的,而严格模式下并没有同步更新,我认为它可能是react的render策略引起的问题

语言描述比较苍白,为此,我录制了一个视频来描述这个行为。并且更改了请求时间为5s,以便你能够更好的看到它读取缓存的数据

Screen.Recording.2024-04-24.at.11.00.37.mov 另外附上链接 Preview

所以,感觉是应该去给 React 提交 issues,或者采用 抽离状态,memo等方式阻止它的更新,来保持和严格模式下的表现一致,以便你在开发环境的表现行为和打包后的表现行为一致。

当然,如果你是拉磨,我更推荐去除严格模式

zhangmo8 avatar Apr 24 '24 03:04 zhangmo8

严格模式下的行为,确实和官网预期的不一样。看来严格模式下的单测有点问题

liuyib avatar Apr 24 '24 03:04 liuyib