Tengo un archivo de índice donde tengo
<BrowserRouter> <Routes> <Route path="/" element={Home} <Route path="/home/student/info" element={Info} /> <Route path="/home/student/about" element={about} /> <Route path="/home/teacher/score" element={score} /> <Route path="/home/teacher/attendence" element={attendence} /> </Routes> </BrowserRouter> Aquí, tengo esta ruta común para "/home/student/" . Entonces, ¿cómo puedo usar una subruta de reacción para esto, en lugar de escribir líneas separadas? Estoy usando react-router 6.
Puede utilizar rutas anidadas. Ponga las rutas como elementos secundarios del componente de ruta. No olvide que en RRDv6, el element prop toma un ReactNode , por ejemplo, JSX, y no una referencia a un componente React como v5.
<BrowserRouter> <Routes> <Route path="/" element={<Home />} /> <Route path="home"> <Route path="student"> <Route path="info" element={<Info />} /> <Route path="about" element={<About />} /> </Route> <Route path="teacher"> <Route path="score" element={<Score />} /> <Route path="attendence" element={<Attendence />} /> </Route> </Route> </Routes> </BrowserRouter>Puede leer más sobre las rutas anidadas aquí .