我使用Flatlist来显示来自api的一些数据但是出于某种原因我可以看到当加载屏幕时自动触发事件我可以看到所有请求都在同时进行,而我没有滚动列表!
代码:
this.state = {
isLoading: false,
categories: [],
page: 1,
};
componentDidMount() {
this.fetchCategories();
}
fetchCategories() {
this.setState({isLoading: true});
categoryApi.getOne(this.state.page).then(response => {
if (response.data) {
this.setState({
categories: this.state.categories.concat(response.data.data),
isLoading: false,
});
} else {
this.setState({isLoading: false});
Alert.alert(
'Something wrong happened!',
'My Alert Msg',
[],
{cancelable: true}
)
}
});
}
componentWillMount() {
}
showMore = () => {
// console.log("End reached.");
this.setState({page: this.state.page + 1});
this.fetchCategories();
};
<FlatList
data={this.state.categories}
extraData={this.state}
renderItem={(rowData) => <CategoryItem navigate={navigate} item={rowData}/>}
onEndReached={this.showMore}
keyExtractor={(item, index) => index}
/>
当page = 1时,我的第一个电话会议中的数据集似乎也有重复数据。