Dart菜单及子菜单跳转新页面报错求助

针对你多页面应用里NHL子菜单点击报错的问题，结合代码给出几个必查修复点：

• 阻止事件冒泡：点击子菜单时会触发父菜单的点击事件，导致冲突。在子菜单的点击函数里加一行e.stopPropagation()，切断事件向上传递：

  const handleSubMenuClick = (e, team) => {
    e.stopPropagation();
    // 这里写跳转到对应球队页面的逻辑，比如navigate(`/nhl/${team}`)
  };
  

• 核对路由配置：确认你的路由里有没有配置NHL子页面的规则，比如要加一条:team的动态路由，不然跳转时会找不到页面报错：

  <Routes>
    <Route path="/nhl" element={<NHLPage />} />
    <Route path="/nhl/:team" element={<TeamDetail />} />
  </Routes>
  

• 修正NavLink的使用：如果子菜单用了NavLink，别重复绑定onClick做导航，直接用它自带的to属性就行，同时加阻止冒泡避免父菜单误触发：

  <NavLink to={`/nhl/${team}`} onClick={(e) => e.stopPropagation()}>
    {team}
  </NavLink>
  

• 检查菜单状态逻辑：如果父菜单是点击展开/收起，别让子菜单点击影响这个状态。父菜单的点击函数只负责切换展开状态，子菜单点击单独处理导航，两者完全分开。

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