我想打印一个分数列表，限制为 5。最新的分数在顶部。该应用程序是一个简单的计时器，用户可以按住按钮，松开，然后点击完成！按钮设置得分状态。当前，当单击完成时，从 scoreArray 打印在应用程序上的分数会成倍地重复多次！按钮。
该代码目前是我被建议尝试的代码，但它不起作用。
用分数设置状态：
onSubmit() {
this.setState(prevState => ({
scoreArray:[this.state.scoreArray.concat(ms(this.state.time,{verbose: true})), ...prevState.scoreArray],
time:0,
submit:true
}));
在渲染中我有这个：
{this.state.scoreArray.map(function(item,i){
return (i < 5) ? <Text key={i}>{item}</Text> : null}).filter(x=>x)
}
我希望分数列表在顶部填充最新分数，将较旧的分数向下推，当分数限制 > 5 时，这些较旧的分数消失。
您再次在“scoreArray”中提供了一个数组，因此是嵌套结构。尝试将 setState 调用更改为：`
this.setState(prevState => ({
scoreArray:[ms(this.state.time,{verbose: true}), ...prevState.scoreArray],
time:0,
submit:true
}));
`
通过这种方式，您可以在数组顶部添加一个新元素，然后在新数组中扩展先前的元素。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句