Estoy trabajando en una aplicación de calendario, que tiene una Agenda de "react-native-calendars". Para mostrar las fechas necesita lo siguiente:
items={{'2012-05-22': [{name: 'item 1 - any js object'}], ...}}En mi backend de Firebase, estoy almacenando el día de inicio y finalización de una cita y también una matriz, que incluye todos los días (por lo que si la cita comenzó ayer y finaliza mañana, la matriz almacena ayer, hoy y mañana como fechas). ¡la cantidad de fechas en la matriz varía!)
La estructura de datos de la api es la siguiente:
apiData = [ {data: {allDays: ["2021-08-18", "2021-08-19", "2021-08-20"], start: "2021-08-18", end: "2021-08-20" }, id: "string"}, {data: {allDays: ["2021-08-20", "2021-08-21", "2021-08-22", "2021-08-23"], start: "2021-08-20", end: "2021-08-23" }, id: "string"}, //more Data ]Obtuve el siguiente código para mapear los documentos:
let markedDayAll = {}; {apiData.map(({data: {start, end, allDays}}) => ( markedDayAll[alldays] = [{ start: start, end: end }] ))};que genera el formato de "elementos" correcto, pero en este momento, obviamente, se muestra así:
items={{ '2021-08-18, 2021-08-19, 2021-08-20': [{start: "2021-08-18, end: "2021-08-20}] }}Pero necesito lo siguiente:
items={{ '2021-08-18': [{start: "2021-08-18, end: "2021-08-20}], '2021-08-19': [{start: "2021-08-18, end: "2021-08-20}], '2021-08-20': [{start: "2021-08-18, end: "2021-08-20}] }}¿Cómo mapeo correctamente los datos para obtener el resultado deseado?
Puede usar array#reduce para iterar a través de cada objeto y luego iterar a través de cada fecha en allDays y generar su objeto.
const apiData = [ {data: {allDays: ["2021-08-18", "2021-08-19", "2021-08-20"], start: "2021-08-18", end: "2021-08-20" }, id: "string"}, {data: {allDays: ["2021-08-20", "2021-08-21", "2021-08-22", "2021-08-23"], start: "2021-08-20", end: "2021-08-23" }, id:"string"} ], result = apiData.reduce((r, {data}) => { data.allDays.forEach(date => { r[date] ??= []; r[date].push({start: data.start, end: data.end}); }); return r; },{}); console.log(result);