我正在使用Firebase和redux来更新数组并将其显示在平面列表中 . 正在_1379429中进行提取调用,我可以看到数据正在被正确提取 . 但是,查看 _myTestRender 方法,它会在 this.props.test 中为每个项目调用两次 .

样本数据:

[{'name':'test1', stuff: [{'key':'Bob'},{'key':'Alice'}]}]

渲染:

console.log('RENDER');
return (
  <View style={{flex: 1}}>
    <View style={styles.container}>
      <FlatList
        keyExtractor={this._keyExtractor}
        data={this.props.test}
        renderItem={({item}) => this._myTestRender(item)} />
      <Button title="log props" onPress={this._logProps} />
    </View>
  </View>
 )
}

_keyExtractor

_keyExtractor = (item, index) => item.name;

_myTestRender

console.log('this')
console.log(item.stuff);
return (
  <Text>{item.name}</Text>
)

除了为每个项目调用_myTestRender两次这一事实之外,这样做很好 . 在我的示例设置中,我希望它能够两次调用_myTestRender,而不是4次 . 尽管如此,我仍然只看到屏幕上出现两个元素 .

控制台日志示例:

RENDER
Test.js:115 this
Test.js:116 (2) [{…}, {…}]
Test.js:115 this
Test.js:116 (2) [{…}, {…}]
Test.js:115 this
Test.js:116 (2) [{…}, {…}]
Test.js:115 this
Test.js:116 (2) [{…}, {…}]

任何意见是极大的赞赏 .