react-native - 在 FlatList 中每隔一定数量的项目后显示不同的组件

Question

我正在使用 FlatList 在我的应用程序中显示我的卡片组件。

我想在列表中一定数量的卡片之后显示另一个组件(例如广告或公告组件)。

作为示例，它应如下所示；

1. 卡片项目
2. 卡片项目
3. 卡片项目
4. 卡片项目

-组件-

卡片项目

卡片项目

卡片项目

卡片项目

-组件-

...继续...

..

Answer 1

您可以尝试SectionList并相应地传递数据。

  <SectionList
  sections={DATA}
  keyExtractor={(item, index) => item + index}
  renderItem={({ item }) => <Item title={item} />}
  renderSectionHeader={({ section: { title } }) => (
    <Text style={styles.header}>{title}</Text>
  )}
/>

我希望这能起作用，否则您可以在平面列表中根据某些条件渲染数据。

renderItem={(item, index)=>{{index/5 ==0 ? return Your view : retrurn your second view.}}