在本机ListView中插入元素

我正在努力将

视图

动态插入React Native中的

列表视图

组件。最后，我想在这里得到类似谷歌图片的东西：

我有一个用

ListView

和以下样式列出的框列表

renderListStyle: {
        justifyContent: 'center',
        flexDirection: 'row',
        flexWrap: 'wrap'
    }

因此，框显示正确，但现在我需要在行之间动态插入一个视图。例如，当我单击第四个框时，视图组件显示在第一行下面。当用户单击8时，视图组件出现在第二行之后，以此类推

有什么办法可以做到吗？我检查了

ListView

的renderSeparator属性，但无法完全获得所需内容。也许有人以前有过这样的问题

---

谢谢你的帮助

listview是否将每个单独的框呈现为一行？如果将所有3个框设置为一行，其中包含您希望包含的视图，并且如果单击其中任何一个框，将显示视图，该怎么办。下面是一个大概的草图，它可能看起来像：

<ListView
  dataSource={this.state.dataSource}
  renderRow={(rowData) => (
    <View>
      <Box onPress={this.showView} /> //the 3 boxes will prob be wrapped in 
      <Box onPress={this.showView} /> //another view to set those to 'row' flexDirection
      <Box onPress={this.showView} />
      <YourView show={this.state.show} />
    </View>
  )}
/>

(
//这3个盒子可能会被包裹起来
//将这些设置为“行”方向的另一个视图
)}
/>

谢谢您的回复。我也在想，但也许还有别的办法。实际上，我希望每行放置3个框（现在有一个），并将视图作为分隔符。但让我们看看。谢谢你的回答！