将一行添加到我的列表视图时,我的行为很奇怪。我不确定我的逻辑哪里错了。我有使用 react-native-tab-view 的标签。在选项卡 2 上,我将一个对象添加到选项卡 4 上显示的“收藏夹”数组中。在添加对象之前,这是正在显示的内容
添加对象并返回选项卡 4 后,这就是我所看到的
和代码
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2})
constructor(props) {
super(props)
this.state = {
favoriteDB: props.favorites,
renderPlaceholder: true,
dataSource: ds.cloneWithRows([])
}
}
componentDidMount() {
InteractionManager.runAfterInteractions(() => {
this.setState({
dataSource: ds.cloneWithRows(this.state.favoriteDB),
renderPlaceholder: false
})
})
}
componentWillReceiveProps(prevProps) {
const {favorites} = this.props
if (JSON.stringify(favorites) != JSON.stringify(prevProps.favorites)) {
this._updateFavorites()
}
}
_updateFavorites() {
const {favorites} = this.props
this.setState({
favoriteDB: favorites,
dataSource: ds.cloneWithRows(favorites)
})
}
render() {
const {dataSource} = this.state
const {visibleHeight, visibleWidth} = this.props
if (this.state.renderPlaceholder)
return <Placeholder/>
return (
<Container theme={theme}>
<View style={{ flex:1, height: visibleHeight - 100, width: visibleWidth }}>
<Row>
<Col>
<List>
<ListView
style={{ height: visibleHeight - 100, width: visibleWidth }}
enableEmptySections={TRUE}
automaticallyAdjustContentInsets={FALSE}
initialListSize={100}
pageSize={100}
dataSource={dataSource}
renderRow={rowData => this._renderRow(rowData)}/>
</List>
</Col>
</Row>
</View>
</Container>
)
}