出现此问题的原因是因为使用useNavigate的模块没有被react的路由所包围，导致路由并不能在这个层面上使用，解决办法有两种：
一、将这个模块被路由模块包围
export default memo(() => {
return (
<Layout>
<Router>
<Routes>
<Route path="/" exact element={<Home foo={1000} />}></Route>
<Route path="/content/:id" element={<Content />}></Route>
</Routes>
</Router>
</Layout>
);
});
例如本代码中的组件，现在是无法使用useNavigate的，如果不破坏结构的话，你要做的应该是将这个路由结构放到路由里面，也就是
<Router>
<Layout />
</Router>
这样你就可以自由的使用useNavigate等hook了。
二、使用原生的window对象
说起window对象肯定不陌生。
如果想在路由外面实现跳转，还有这个最原始的方法，虽然不是路由内的跳转，但是一样可以实现这些功能，不妨试试。
如果无法使用的useNavigate的时候，可以直接使用window.open方法
window.open(href, '_self')
我想大多数人都知道这个吧，一样可以实现跳转，而且很好用。如果你也遇到了同样的问题，试试这个吧。
