When using search parameters in a nested React route, when I'm on /app, and after clicking the link that navigates to /app/user, the navigation doesn't work.
If I try to use without nesting, it works. But why it doesn't work when nested.
Codesandbox: CodeSandBox link
<Routes>
<Route path="/" element={<LandingPage />} />
<Route path="/app" element={<Main />}>
<Route path=":user" element={<User />} />
</Route>
<Route path="*" element={<PageNotFound />} />
</Routes>
try it
<Routes> <Route path="/" element={<LandingPage />} /> <Route path="/app" element={<Main />} /> <Route path="/app/:user" element={<User />} /> <Route path="*" element={<PageNotFound />} /> </Routes>If you want to nest the
User.jscomponent, you need to addOutletinMain.jsimport { Link, Outlet } from "react-router-dom"; export default function Main() { return ( <div> <p>Main Page</p> <Link to="/app/ashish">点击进入用户页面</Link> <Outlet/> </div> ); }