React Native FlatList 忽略项目间距

Question

我真的很难弄清楚为什么我不能让我的 FlatList 以我期望的方式呈现项目。

我正在使用 react-query 来获取数据数组。我将此数组传递给我的 FlatList 进行渲染，然后我使用渲染函数来渲染列表项。然而，我的平面列表有时会完全忽略所有项目的填充和边距。

这里有一个 sn-p 可以更好地解释我想要做什么：

function Component() {
  data = [
    {a: true, otherStuff},
    {b: true, otherStuff}
  ]
  
  function renderItem({item, index}) {
    if (item.a) {
      return <ListItemA/>
    }
     if (item.b) {
       return <ListItemB/>
  }

render(
  <FlatList
    renderitem={renderItem}
    data={data}
  />
  )
}

Answer 1

如果你将组件代码上传，它会更清楚。 尝试使用item separator 并在那里添加间距 https://reactnative.dev/docs/flatlist#itemseparatorcomponent一个