0
115
VistasReact Router V6 parada completa haciendo que la URL no sea válida
Usando useRoutes y Outlet . Tengo el siguiente ejemplo de ruta:
const routes = [ { path: "/", element: <Dashboard/>, children: [ { path: "/*", element: <Profile /> }, { path: "/*/example", element: <Example/> }, ], } ] const App= () => { const route = useRoutes(routes) return <div>{route}</div> } Quiero enviar user_id a la url, por ejemplo /user1 esto carga el componente como se esperaba, sin embargo, cuando escribo algo como /firstname.surname , aparece el error de seguimiento. Cannot GET /firstname.surname sin embargo, /firstname.surname/example carga el componente
Esto se debe al punto final en el Id. ¿Cómo puedo resolver esto y aceptarlo como una URL válida?
Cuando actualizo la ruta del tablero a "" , parece funcionar, sin embargo, cuando hago algo como /foo.bar/test , carga el componente de perfil, ¿cómo restrinjo esto ya que esta ruta no existe?
2 Respuestas
Responde la pregunta0
Creo que el comodín en { path: "/*/example", element: <Example/> } no funciona bien con otras rutas que también especifican el comodín. Tengo entendido que "/*" es válido solo al final de la ruta para indicar coincidencias de rutas anidadas más profundas.
Sin embargo, la siguiente configuración parece funcionar, usando un parámetro de ruta con nombre.
const routes = [ { path: "/", element: <Dashboard />, children: [ { path: "/*", element: <Profile /> }, { path: "/:path/example", element: <Example /> } ] } ]; 
0
const routes = [ { path: "/", element: <Dashboard/>, children: [ { path: "/:id", element: <Profile /> }, { path: "/:id/example", element: <Example/> }, ], } ] const App= () => { const route = useRoutes(routes) return <div>{route}</div> }"*" es un comodín genérico necesario para pasar una identificación como la anterior