Estoy trabajando con el kit de gráficos nativos de reacción, quiero poder mostrar un gráfico de gastos en mi aplicación nativa de reacción. estoy usando moment.js y moment-range
calendar.forEach((range) => { const label = range.start.format('DD MMM') loaded.labels.push(label); const filtered = spendingData .filter(item => range.contains(moment(item.timestamp))) .reduce((a,b) => (a.spent || 0) + (b.spent || 0), 0); loaded.data.push(filtered); }); setGraph({...graph, labels: loaded.labels, data: loaded.data});
El filtro por sí mismo devuelve los elementos correctos, cada vez que uno o más objetos caen dentro del rango, deben pasarse a la función de reducción para agregarlos.
Objetos devueltos sin reducción (fechas sin nada debajo significa que no hubo gastos ese día) esto funciona bien:
26 Dec --------- 02 Jan --------- 09 Jan --------- 16 Jan Object { "spent": 3.8, "timestamp": 1642713860026, } Object { "spent": 12, "timestamp": 1642714020254, } --------- 23 Jan --------- 30 Jan Object { "spent": 2.4, "timestamp": 1643582338356, } Object { "spent": 5.5, "timestamp": 1643582748421, }
Datos devueltos después de reducir los valores de item.spent
, aquí es donde radica el problema:
0 0 0 12 0 5.5