Reactjs 反应钩子列表大小-反应本机

我目前正在研究钩子，我试图在单击按钮时创建一个句子，并验证它们是否正确。然而，要做到这一点，我的列表最多只能有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

const[句子，setcentence]=useState（[]）；
如果（句子==='HelloYouAreMyFriend'）{
console.log（'句子'）
}
{selectedWord.word.map（word=>(
setCount（句子+单词）}
}>
例子
//1按钮点击：你好
//2按钮点击：你好
//3按钮点击：你好
//4按钮点击：HelloYourAreMy
//5按钮点击：你好你是我的朋友
//6按钮点击：你是我的朋友
需要最大大小==>列表中的5个单词

我假设您正在处理

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);
  }
}

const[句子，setcentence]=useState（[]）；
const handlePlaySound=（事件）=>{
const word=event.target.key
const localsential=[…句子]；//因为您从不改变状态
if（localsense.length<5）{
setEntence（[…本地句子]，单词）
}否则{
局部句子拼接（0,1）；
setcentence（[…本地句子]，单词）；
}
}

从组件中，您应该在事件中传递单词

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

什么是

count

变量？count是一个在另一个后面添加单词的列表提示：始终为变量和函数使用有意义的名称。谢谢