Я пытаюсь вставить объект фильма в массив избранного в состоянии, когда что-то нажимается.
Установка массивов избранного в состояние работ:
addToFavorites = (movie) => {
const favoritesArray = [];
favoritesArray.push(movie);
this.setState({favorites: favoritesArray});
}
Но когда я пытаюсь использовать функцию обновления в соответствии с рекомендациями React, я получаю ошибки:
this.state = {
favorites: []
};
addToFavorites = (movie) => {
const favoritesArray = [];
favoritesArray.push(movie);
this.setState(prevState => ({
favorites: [...prevState.favorites, favoritesArray]
}))
}
Uncaught TypeError: недопустимая попытка распространить не повторяемый экземпляр
Кажется, он работает, если в состоянии уже что-то есть (не пустой массив).
2 ответа
У вас есть несоответствие в ваших типах, вы добавляете массив как элемент другого массива (что, я считаю, не то, что вы хотели). Кроме того, вы можете предотвратить распространение пустого state.favorites
в функции средства обновления. Следующий код должен работать:
addToFavorites = (movie) => {
this.setState(prevState => ({
favorites: [...(prevState.favorites || []), movie]
}));
}
...(prevState.favorites || [])
гарантирует, что распространение не завершится неудачей в случае, если prevState.favorites
равен null
или undefined
.
Во-первых: когда вы пытались распространить старые фавориты в новом состоянии фаворитов, вы забыли распространить массив избранных, который вы объявили ранее.
Строка должна была быть такой: избранное: [... prevState.favor, FavoritesArray]
Поскольку вы просто хотите добавить объект фильма в массив избранных, вам даже не нужно объявлять массив FavoritesArray. Просто добавьте его в массив в setState. Как это:
addToFavorites = (movie) => {
this.setState(prevState => ({
favorites: [...prevState.favorites, movie]
}))
}
Где именно вы устанавливаете состояние. Кажется, что ваши фавориты в вашем prevState не определены или ничего не распространяются, как предполагает ошибка, т.е. не Array, не Object
Похожие вопросы
Новые вопросы
reactjs
React - это библиотека JavaScript для создания пользовательских интерфейсов. Он использует декларативную компонентную парадигму и стремится быть одновременно эффективным и гибким.