FlatList不会向下滚动,但会缩回顶部

时间:2018-12-20 06:23:09

标签: react-native react-native-flatlist

滚动后,平面列表返回顶部。因为我的代码,这可能发生的任何明显原因吗?

react-native-cli: 2.0.1

本机: 0.57.4

平面列表代码

return (
            <View style={{ flex: 1}}>
                    <FlatList
                        data={this.state.dataSource}
                        onEndReached = {() => this.getDeals()}
                        ListHeaderComponent = {() => <MainAdvertisement/>}
                        onEndReachedThreshold={1}
                        renderItem={this._renderItem}
                        ListFooterComponent={()=>((this.state.loading || this.state.loading=="")&&!this.state.gotAllDeals) ? <ActivityIndicator size="small" color="gray"/> : null}
                        keyExtractor={(item, index) => item._id}
                    />
            </View>
);

getDeals() 当到达Flatlist结束时调用此函数。

    getDeals = () => {
    this.setState({
        loading: true,
    });
    let url = this.state.url;
    let offsetEncoded = encodeURIComponent(this.state.offset);
    url=url+"offSet="+offsetEncoded+"&&filters="+JSON.stringify(this.props.filters);
    console.log(url);
    fetch(url)
    .then((res)=>{
        if (!res.ok) {
            throw Error(res.statusText);
        }
        return res;
    })
    .then((res) => res.json())
    .then((responseJson) => {
        if(responseJson.length==0){
            this.setState({
                gotAllDeals:true,
                loading:false
            })
        }
        else{
            this.setState({
                loading: false,
                dataSource: this.state.offset==0 ? responseJson : [...this.state.dataSource, ...responseJson],
                offset: this.state.offset + responseJson.length,  
                dealList_ErrorStatus: false              
            });
        }
    })
    .catch((err) => {
        this.setState({
            dealList_ErrorStatus: true,
            loading:false
        })
        console.log("Error: "+err);
    });
}

ScreenRecording

0 个答案:

没有答案