У меня было действие сделать API-интерфейс к бэкэнду, чтобы получить массив объектов.Затем действие отправляет обновление в переменную состояния.На этом этапе я встречаю следующую ошибку:
Objects are not valid as a React child (found: object with keys {x, y}).
If you meant to render a collection of children, use an array instead.
Следующий код был свернут, чтобы все еще выдавать ошибку:
getDonationData : (reportType, recordCount) => (dispatch => {
return Axios.post(`http://localhost:4000/reports/`,
{
reportType, recordCount
}
)
.then(apiResponse => {
const returnedArray = apiResponse.data;
dispatch({
type : 'reportData',
payload : [{x: 1, y: 2}, {x: 4, y: 3}]
})
})
})
Если объекты в массиве заменяются числами, такими как[1, 2, 3]
ошибка исчезает.
Кто-нибудь знает, почему это происходит и как обойти возможное ограничение вложенности?Мои фактические данные содержат около 500 элементов, а значения x также являются объектами даты (это данные диаграммы).
Код редуктора:
case 'reportData':
return {
...previousState,
reportData : action.payload
};