Reactnative 如何 break .map 功能

<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>

peopleGroup
.slice(0, 5) // creates a copy of original, 5 items long
.map(...) // subsequent operations work on the copy

React-native相关问答推荐

'无法解析模块.安装react-native-pager-view后的实用程序/平台

expo 日历应用因权限问题而崩溃

导出命名空间应首先由 `@babel/plugin-proposal-export-namespace-from` 转换

错误：HostFunction 中的异常： Malformed calls from JS： field sizes are different. In an Animated View

react native ：navigationOptions 中的标题样式不起作用

如何在 react-native 中设置 Onpress On Textinput

可能的未处理promise 拒绝(id：0)：错误： "getLoginData" is read-only

Invariant Violation：requireNativeComponent： "RNCWebView" was not found in the UIManager

用于部署后设置的 React 配置文件

React Native - 如何判断 UI/元素？

从堆栈导航器中删除屏幕

try 添加包时出现错误duplicate entry：com/google/android/gms/internal/zzble.class

将 svg 转换为 react-native-svg

如何将 Leaflet.js 与 react-native 一起使用

如何使用 Expo 在真实的 iOS 设备上运行应用程序？

我可以使用 react native 开发 pwa

React Native EXPO Apple 上传失败

在不使用 3rd 方库的情况下，在react-native中显示主屏幕之前显示启动画面

使用 typescript react-native - 如何使用来自 @react-navigation/native 的 useRoute 和 typescript

React Native 模块中的依赖注入