Estoy creando una navegación de migas de pan similar a app.box.com con mongo, express y react. La miga de pan en ese sitio web no usa URI para crear la miga de pan. Por ejemplo, si /home/level1/level2/level3 es la ruta de navegación y hago clic en level2 , la solicitud realizada al servidor es /folder/{folder_id} en lugar de /home/level1/level2 y la ruta de navegación se trunca a /home/level1/level2 . Para lograr esto, ¿cómo estructurar los datos en mongodb? ¿Y cómo manejarlo en reaccionar para crear la ruta de navegación mientras se asegura de que funcionará entre actualizaciones?

Si creo un esquema como

 { _id: "asdfasdf", name: "level2", type: "folder", path: "/home/level1/level2" }

y luego, al reaccionar, divida la ruta en una matriz para crear una ruta de navegación, entonces no podré realizar /folder/{folder_id} solicitudes GET. Puedo ignorar la ruta, crear un estado de matriz vacío y luego agregar la ruta y la URL a la matriz. Por ejemplo, después de inicializar un estado de matriz vacío, si hago clic en el botón level1 , se agregará { name: "level1", URL: "/folder/level1-id" } a la matriz. Entonces puedo usar esa matriz para construir migas de pan. Pero esto no sobrevivirá a la actualización de la página. El pseudocódigo es el siguiente,

 const [pathArr,setPathArr] = useState([]); // Make initial request to /home // add { name: "Home", URL: "/folder/0" } to pathArr // parsed breadcrumb will /home // display files and folders received // click on level1 folder button // Push { name: "level1", URL: "/folder/level1_id" } to pathArr // parsed breadcrumb will /home/level1 // Do same for level2, pathArr = [ {home obj},{level1 obj}, {level2 obj} ] // Click on level1 breadcrumb // pathArr = [ { home object }, { level1 object } ] }

Se agradece cualquier otra sugerencia sobre el esquema mongodb o la navegación de reacción.