Tengo un problema con la devolución de context.params de los archivos anidados. Está sucediendo porque dentro data.map(el => el.hours) devuelve una matriz de objetos. Es por eso que de alguna manera tengo que mapear nuevamente para obtener todos los valores de la matriz. ¿Alguien sabe cómo solucionar este problema?
Estructura:
- index.js - [date] - index.js - [hour].jsBase de datos:
[ { date: '11-03-2022', hours: [{ hour: '10-00' }, { hour: '11-00' }, { hour: '12-00' }], }, { date: '12-03-2022', hours: [{ hour: '10-00' }, { hour: '11-00' }, { hour: '12-00' }], }, ][hora].js
import React from 'react' import FormComponent from '../../components/FormCalendar/FormComponent' import Layout from '../../components/Layout/Layout' const Hours = ({ data }) => { return ( <div className="flex h-screen flex-col"> <Layout> <FormComponent data={data} /> </Layout> </div> ) } export default Hours export async function getStaticPaths() { const res = await fetch(`http://localhost:3000/api/mongo`) const data = await res.json() const paths = data.map((el) => { return { params: { date: `${el.date}`, hour: el.hours.map((item) => `${item.hour}`), }, } }) return { paths, fallback: false, } } export const getStaticProps = async (context) => { const { params } = context const res = await fetch( `http://localhost:3000/api/mongo/${params.date}/${params.hour}` ) const data = await res.json() return { props: { data }, } }Tengo un error: Error: No se proporcionó un parámetro requerido (hora) como una cadena en getStaticPaths para /[fecha]/[hora]