React-Native ListView正确返回空行

Question

如何跳过在ListView中呈现的行。以下示例有效，这是我会这样做的正常方式。

renderRow(rowData) {
  if (!rowData.foo) { return null; }

  return <View style={{ height: 100 }}><Text>{rowData.bar}</Text></View>
}

这个问题是，只要1行返回null就不会调用onChangeVisibleRows。

与

相同的结果

if (!rowData.foo) { return <View style={{ height: 0 }} />; }

，而

if (!rowData.foo) { return <View style={{ height: 1 }} />; }

工作正常，但不是一个好的解决方案。

所以，我的猜测是它是一个ListView-Bug但是返回null真的是跳过渲染行的正确方法吗？我还没有找到任何其他选择。

Answer 1

您应该在设置DataSource之前过滤数据：

dataSource.cloneWithRows(
   yourDataArray.filter(item => item.foo !== null)
);

Answer 2

尝试：

if (!rowData.foo) { return <View style={{ opacity: 0 }} />; }