我正在使用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) [{…}, {…}]
任何意见是极大的赞赏 .