CJY0208 / react-router-cache-route

Route with cache for react-router V5 like <keep-alive /> in Vue
https://www.npmjs.com/package/react-router-cache-route
MIT License
1.14k stars 110 forks source link

用react 17 的ReactDOM.render(), 缓存成功, 但不支持react 18的版本 ReactDOM.createRoot() 缓存失败,请问有兼容方案? #151

Open wumian27 opened 1 year ago

wumian27 commented 1 year ago

切换路由从新回到已经切换的路由, 会报错 但用 ReactDOM.render()不会报错

CJY0208 commented 1 year ago

报错的内容是啥?

wumian27 commented 1 year ago

react-dom.development.js:22680 Uncaught Error: [mobx-state-tree] Value undefined is no MST Node at Vt (sdk.js:893:30276) at mt (sdk.js:893:28892) at E (sdk.js:893:3301) at r.componentWillUnmount (sdk.js:1921:3294) at r.h (sdk.js:1551:1236) at r. (sdk.js:1551:1445) at callComponentWillUnmountWithTimer (react-dom.development.js:22698:16) at safelyCallComponentWillUnmount (react-dom.development.js:22715:7) at commitUnmount (react-dom.development.js:23566:13) at commitNestedUnmounts (react-dom.development.js:23613:7)

CJY0208 commented 1 year ago

看起来好像不是和 cache-route 直接相关的报错,有可能是 mobx 的错误吗?

wumian27 commented 1 year ago

但是用react17的 ReactDOM.render 可以正常使用 ,下面错误还有 react-dom.development.js:18535 The above error occurred in the <WithStore(t)> component:

at r (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:1921:426)
at o (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:1923:2907)
at t (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:2039:778)
at t (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:2039:2712)
at t (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:2029:497)
at t (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:2025:324)
at a (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:1951:1004)
at a (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:1713:1498)
at t (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:2041:454)
at o (https://ux-assest.jlpay.com/emp/amis-dev/sdk.js:1923:2907)
at div
at SchemaRender (http://10.150.129.21:8092/static/js/src_bootstrap_tsx.077d1146.js:128:66)
at C (https://ux-assest.jlpay.com/emp/react-router-dom/react-router-dom.js:3545:39)
at Updatable (http://10.150.129.21:8092/static/js/vendors-node_modules_babel_runtime_helpers_asyncToGenerator_js-node_modules_babel_runtime_hel-9d5752.1e9fd295.js:17746:5)
at Suspender (http://10.150.129.21:8092/static/js/vendors-node_modules_babel_runtime_helpers_asyncToGenerator_js-node_modules_babel_runtime_hel-9d5752.1e9fd295.js:17622:5)
at Suspense
at Freeze (http://10.150.129.21:8092/static/js/vendors-node_modules_babel_runtime_helpers_asyncToGenerator_js-node_modules_babel_runtime_hel-9d5752.1e9fd295.js:17663:22)
at DelayFreeze (http://10.150.129.21:8092/static/js/vendors-node_modules_babel_runtime_helpers_asyncToGenerator_js-node_modules_babel_runtime_hel-9d5752.1e9fd295.js:17691:5)
at Updatable$1 (http://10.150.129.21:8092/static/js/vendors-node_modules_babel_runtime_helpers_asyncToGenerator_js-node_modules_babel_runtime_hel-9d5752.1e9fd295.js:17771:22)
at div
wumian27 commented 1 year ago

如果不用[react-router-cache-route 页面不会报错,正常使用

ruoru commented 1 year ago

close DelayFreeze and export default Updatable will well.

https://github.com/CJY0208/react-router-cache-route/blob/5fd71d9fcf765fbd4632d3cb6b1e26612ae21bf2/src/core/Updatable/index.js#L10-L44

export default (props) => (
    <Updatable {...props} />
)

and why add freezeTimeout?