Обновление массива состояний постепенно, а не полностью

Question

Я довольно новичок в React, и я просто разбираюсь с использованием хуков, особенно useEffect:

```const Upload= ({  uploadedCard, cards}) => 
 {useEffect(() => {
cards.push(uploadedCard);
 }, [uploadedCard]); };```

По сути, каждый раз, когда загруженная карта возвращается из топора ios api, я хочу карты состояние, чтобы добавить эту новую карту к нему. Обратите внимание, что карты - это массив, и поэтому я хочу, чтобы этот массив добавлял новую карту, а не загружал все карты одновременно (что мой текущий подход делает):

useEffect(() => {
   getAllCards();
  }, [uploadedCard]);

Обратите внимание на второй фрагмент кода, который Когда я вызываю getAllCards () для моего бэкэнда, используя редукторы React-redux, он автоматически возвращает массив 'cards' в качестве полезной нагрузки, и поэтому мой второй подход работает отлично, но он также заставляет рендерить "карты" с начала. Любая помощь в том, как обойти эту проблему, высоко ценится!

Спасибо :)

Answer 1

Вам нужно хранить карты в местном штате в первую очередь. Затем useEffect будет запускаться каждый раз, когда компонент Upload получает другую загруженную карту, добавляя ее в массив карт

const Upload= ({ uploadedCard, cards }) => {
  const [ allCards, setAllCards ] = useState(cards);
   useEffect(() => {
   setAllCards([ ...cards, uploadedCard]);
  }, [ uploadedCard ]); 
};