如何打破 .map 功能 [英] How to break .map function
本文介绍了如何打破 .map 功能的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何破坏 .map 函数?下面附上代码示例.我想在索引达到 5 时打破外观,因为我只想将 5 个头像渲染到屏幕上.
how to break a .map function? Code samples attached below. I want to break the look once the index reached at 5 because I only want to render 5 Avatar to the screen.
<View style={{ flexDirection: 'row', marginTop: 20, marginLeft: 30 }}>
{
peopleGroup.map((people, i) => {
if(i<5) {
return (
<Avatar
key={people.id}
width={30}
position='absolute'
containerStyle={{ transform: [{translate: [-28 + (28 * i), 0, 1 - (i * 0.1)]}] }}
small
rounded
source={{uri: people.image}}
activeOpacity={0.7}
/>
)
}else if(i===5) {
return (
<View key={i} style={{ transform: [{translate: [(25 * i), 9, 0]}] }}>
<Text>{peopleGroup.length}</Text>
</View>
)
}
}
)
}
</View>
推荐答案
在映射之前使用 Array.slice
.
peopleGroup
.slice(0, 5) // creates a copy of original, 5 items long
.map(...) // subsequent operations work on the copy
多田!
这篇关于如何打破 .map 功能的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文