React多级滑动菜单点击二级项跳转按钮报错求助

• 核心问题：你的代码中使用了props.history.push进行路由跳转，但在React Router v6中，history props不再通过组件传递，且useHistory钩子已被废弃，改用useNavigate。

• 修复步骤：

  1. 导入useNavigate钩子：

     import { useNavigate } from 'react-router-dom';
     

  2. 在组件内部初始化导航函数：

     const Menu = () => {
       const navigate = useNavigate();
       // 其他代码...
     };
     

  3. 修改跳转逻辑函数，替换props.history.push：

     const handleNavigate = (path) => {
       navigate(path);
       // 按需添加菜单关闭逻辑，比如设置isOpen状态为false
     };
     

  4. 确保你的Menu组件被BrowserRouter（或其他Router组件）包裹，否则useNavigate无法正常工作。

• 额外检查：确认二级菜单跳转按钮的onClick事件正确传递了路径参数，比如onClick={() => handleNavigate('/about')}，避免因参数缺失导致的报错。

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