React UseState hook, неспособный объединить массивы - PullRequest
0 голосов
/ 13 июля 2020

Я сталкиваюсь со странным поведением при попытке сложить два массива в реакции. Каждый фрагмент массива имеет длину 50 элементов. Мой список никогда не превышает 50.

Я пробовал использовать как оператор распространения, так и метод concat, с функциями оболочки и без них. ничего не работает

setWordList(wordList => wordList.concat(msg))
setWordList(wordList => [...wordList, msg]) 
setWordList([...wordList, msg]) 
setWordList(wordList.concat(msg)) 
  const [wordList, setWordList] = useState([])
  const [isSearching, setIsSearching] = useState(true)


  
  const loadMoreList = (data) => {
    console.log(data)
    setIsSearching(true)
    let already = []
    for(let i = 0; i < wordList.length; i++){
      already.push({_id: wordList[i]._id})
    }
    console.log(already)
    socket.current.emit('get word list more', {filter: data.filter, already: already});
  }

  

  socket.current.on('word list in', (msg) => {
  
    setWordList(wordList => [...wordList, msg])
    
    console.log(msg)
    setIsSearching(false)
   
  });

Пример данных (длина массива = 50)

[{
definition: "1. aufhören zu leben, sein Leben beschließen↵Beispiele↵“jung sterben”↵Wendungen, Redensarten, Sprichwörter↵“zum Sterben langweilig, müde, einsam o. Ä...."
id: "dfe03030-0c50-11ea-afa4-098be982e090"
leitner_no: 2
priority: true
priority_time: 1587986213134
reviews: 1
source: "manual"
source_details: "none"
time_stamp: 1583402873665
word: "sterben  | starb, gestorben |"
_id: "fb99b7c3-34a4-4e63-a98e-41efbbcfe5fc"}]

Текущий список и входящие данные никогда не объединяются, новые данные, кажется, заменяют то, что в списке уже. Console.log из wordList в socket('word list in') возвращает пустой список независимо от того, есть ли данные, отображаемые из предыдущего ввода. Почему-то состояние не сохраняется. Любая помощь будет принята с благодарностью.

1 Ответ

0 голосов
/ 13 июля 2020

Необходимо разложить оба массива, например:

setWordList(wordList => [...wordList, ...msg])
...