Как подтолкнуть массив в состояние в React? Получение "Недопустимая попытка распространить не повторяемый экземпляр"

Question

Я пытаюсь вставить объект фильма в массив избранного в состоянии, когда что-то нажимается.

Установка массивов избранного в состояние работ:

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: недопустимая попытка распространить не повторяемый экземпляр

Кажется, он работает, если в состоянии уже что-то есть (не пустой массив).

reactjs

1

mikesuchor 29 Май 2019 в 19:40

Answer 1

У вас есть несоответствие в ваших типах, вы добавляете массив как элемент другого массива (что, я считаю, не то, что вы хотели). Кроме того, вы можете предотвратить распространение пустого state.favorites в функции средства обновления. Следующий код должен работать:

addToFavorites = (movie) => {
    this.setState(prevState => ({
        favorites: [...(prevState.favorites || []), movie]
    }));
}

...(prevState.favorites || []) гарантирует, что распространение не завершится неудачей в случае, если prevState.favorites равен null или undefined.

1

Dan Homola 29 Май 2019 в 16:50

Answer 2

Во-первых: когда вы пытались распространить старые фавориты в новом состоянии фаворитов, вы забыли распространить массив избранных, который вы объявили ранее.

Строка должна была быть такой: избранное: [... prevState.favor, FavoritesArray]

Поскольку вы просто хотите добавить объект фильма в массив избранных, вам даже не нужно объявлять массив FavoritesArray. Просто добавьте его в массив в setState. Как это:

addToFavorites = (movie) => {
  this.setState(prevState => ({
    favorites: [...prevState.favorites, movie]
  }))
}

Где именно вы устанавливаете состояние. Кажется, что ваши фавориты в вашем prevState не определены или ничего не распространяются, как предполагает ошибка, т.е. не Array, не Object

0

tabulaR 29 Май 2019 в 16:52

Как подтолкнуть массив в состояние в React? Получение "Недопустимая попытка распространить не повторяемый экземпляр"

2 ответа

Новые вопросы

reactjs