Размер списка React Hook - React Native - PullRequest
0 голосов
/ 06 февраля 2020

В настоящее время я работаю над хуками и пытаюсь создать предложение при нажатии кнопок и проверять их, если они правильные. Однако, чтобы сделать это, мой список должен быть не более 5 слов, и у меня возникли проблемы с этим.

Идея состоит в том, что, когда список достигает 5 значений, он имеет максимальный размер. И когда добавляется другое значение, оно выскакивает первое значение (с индексом 0) и добавляет последнее значение.

вот мой код:

  const [sentence, setSentence] = useState([]);

  if(sentence==='HelloYouAreMyFriend'){
    console.log('sentence')
  }

        </View>
  <View> 
  {selectedWord.word.map(word => (
    <TouchableOpacity key={word}
onPress={() => setCount(sentence + word )}

  }>

Example 
        // 1 button click: Hello
        // 2 button click: HelloYou
        // 3 button click: HelloYouAre
        // 4 button click: HelloYourAreMy
        // 5 button click: HelloYourAreMyFriend
        // 6 button click: YourAreMyFriendJosh 
        Need SIZE max ==> 5 words in the list

1 Ответ

0 голосов
/ 06 февраля 2020

Я предполагаю, что вы обрабатываете все вещи в функции handlePlaySound.

const[sentence, setSentence] = useState([]);

const handlePlaySound = (event) => {
const word = event.target.key
const localSentence = [...sentence]; //because you never mutate the state
  if (localSentence.length < 5) {
    setSentence([...localSentence], word)
  } else { 
    localSentence.splice(0,1);
    setSentence([...localSentence], word);
  }
}

и от компонента вы должны передать слово в событии

<TouchableOpacity key={word} onPress={handlePlaySound} />
...