CJY0208 / react-activation

Hack <KeepAlive /> for React
https://www.npmjs.com/package/react-activation
MIT License
1.78k stars 140 forks source link

react-router6 + vite 里使用 @vitejs/plugin-react 产生的问题 #310

Closed dreammaker7 closed 4 months ago

dreammaker7 commented 5 months ago

vite 使用 @vitejs/plugin-react 插件并且使用 RouterProvider 方式渲染路由遇到的问题(都在 build 后出现,dev 中正常):

  1. 使用 AliveScope 包裹 RouterProvider 会造成渲染 outlet 内容时抛出以下错误(build 后渲染异常图),开启 sourceMap 查看到是 useNavigate 抛出 context 问题
  2. AliveScope 放置在 RouterProvider 内,各页面缓存将失效,跳转下一个页面时,会重复渲染一次当前页面并且如 searchParams 等全部获取异常,antd 的 ProTable params 依赖未改变的情况下 request 属性也会被重新触发,但 useEffect 并未被重新触发,具体现象请在复现内查看

build 后渲染异常图

image

复现:codesandbox

dreammaker7 commented 5 months ago

如遇到上述问题,将 @vitejs/plugin-react 包替换为 @vitejs/plugin-react-swc,问题得以解决。