} ">
我想在每次刷新列表时在renderItem
的componentDidMount
方法中发出一个fetch请求,但是FlatList
只调用生命周期方法一次。
列表
<FlatList data={this.state.dataSource}
renderItem={({item}) => <ListItem imageHref={item.imageHref} />}
keyExtractor={(item, index) => index.toString()}
refreshing={this.state.refreshing}
onRefresh={/* Fetching data from JSON and updating dataSource[] */} />
在ListItem
组件内部:
render() {
return <Image source={this.state.imageSource} />
}
componentDidMount() {
fetch(this.props.imageHref)
.then(response => {
if(response.status !== 200)
this.setState({imageSource: require('../assets/default-image.png')
else
this.setState({imageSource: {uri: this.props.imageHref}});
}
});
}
我尝试在render
方法中调用fetch
,但也不起作用。
基本上,我希望每次刷新列表时imageSource
都会更新。请帮帮忙。
发布于 2020-01-15 15:33:09
正因为如此,ListItem
没有改变。你必须在onRefresh
中获取新的图标,并将其传递到ListItem
中,然后当ListView刷新时,所有数据都将更改...如果要在ListItem
中执行此操作,则需要与特定项进行一些交互,例如,某个按钮,如果用户按下该按钮,则需要获取和更改图标
发布于 2020-01-15 17:13:38
我不知道您的列表何时刷新,但您可以尝试此this.forceUpdate()
您可以在此处了解更多信息force component to re render
https://stackoverflow.com/questions/59754338
复制相似问题