TypeError: Cannot read 'push' of undefined 用useNavigate修复后页面空白求助

• 确认react-router-dom版本：useNavigate为react-router v6专属API，若你项目依赖的版本为v5及更早版本，该API无法正常调用，会抛出异常阻断页面渲染，出现空白页。可执行npm list react-router-dom查看本地版本，不符合要求的话升级到v6正式版即可。
• 确认路由配置正确性：检查你的项目路由表中是否定义了/cart/:productId对应的路由规则，若跳转的目标路径未在路由表中注册，且未配置404兜底路由，跳转后就会显示空白页。
• 确认Router组件嵌套逻辑：所有使用react-router相关hook（包括useNavigate、useParams）的组件，必须嵌套在BrowserRouter或HashRouter组件的内部，否则hook调用会抛出未捕获异常，导致页面渲染中断。你可以打开浏览器控制台查看是否存在相关的hook调用报错信息。
• 确认路由参数有效性：你通过useParams().id获取productId，需要确认当前页面的路由是否配置了:id参数位，若参数位缺失，params.id为undefined，跳转后的路径/cart/undefined?qty=xx无法匹配到对应路由，也会出现空白页。
• 确认Redux配置正确性：你使用useSelector获取state.productDetails，需要确认redux store中是否正确注册了productDetails对应的reducer，若reducer未注册，productDetails为undefined，解构赋值{ loading, error, product }时会抛出异常，阻断页面渲染。

内容的提问来源于stack exchange，提问作者Ilia Shkliar