RenderFooter无限调用

时间:2019-10-04 18:46:40

标签: react-native listview android-recyclerview react-native-flatlist

当我到达FlipKarts recyclerlistview的底部时,它进入一个无限循环,调用renderFooter数千次,而我无法向上滚动了……。不知道这可能是什么。它应该滚动到底部,然后简单地弹起或停留在底部。相反,它卡住了,我在github或stackoverflow上什么也找不到。

    renderFooter() {
        if(this.state.outPosts == false) {
            return <View style={{
                alignContent:'center', 
                justifyContent:'center', 
                alignItems:'center', 
            }}>
                <ActivityIndicator 
                    style={{
                        marginTop:15*factor_ver,
                        marginBottom:15*factor_ver,
                    }} 
                    size={"small"}
                    color={'#9b9b9b'}
                />
            </View>
        }
        else if(this.state.outPosts == true) {
            return <View style={{
                        height:140*factor_hor, 
                        marginTop:20, 
                        alignContent:'center', 
                        justifyContent:'center', 
                        alignItems:'center', 
                    }}>
                        <Text style={{textAlign:'center', fontSize:22*factor_hor, fontFamily:'Avenir Next', color:'#9b9b9b',}}>
                            No posts! :(
                        </Text>
                        <View style={{flex:1,}}></View>
                        <Block width={60*factor_hor}
                            height={60*factor_hor}
                            style={{
                                justifyContent:'center',
                                alignContent:'center',
                                flex: 1,
                        }}
                        />
                        <View style={{height:30}}></View>
                    </View> 
        }
    }


                    <RecyclerListView 
                        style={{flex:1, backgroundColor:'#f7f7f7', paddingTop:8*factor_hor,}}
                        extendedState={this.state}
                        rowRenderer={this._renderRow} 
                        dataProvider={this.state.dataProvider}
                        layoutProvider={this._layoutProvider}
                        showsVerticalScrollIndicator={false}
                        onEndReached={() => this.fetchPosts()}
                        onEndReachedThreshold={500}
                        renderFooter={this.renderFooter}
                        onScroll={(e) => this.handleScroll(e)}
                        scrollThrottle={250}
                        refreshControl={
                        <RefreshControl
                            tintColor={'white'}
                            refreshing={false}
                            onRefresh={() => { 
                                this.setState({isLoad:true}), this.refresh_feed()}} 
                        />}
                    />

1 个答案:

答案 0 :(得分:0)

太好了,我将在这里不再赘述,因为我找不到别的解释。如果您使用React本机的FlipKart recyclerlistview渲染空白视图,那么当您滚动到底部时,这种毛刺就会发生,您无法向上滚动,并且renderFooter被无限调用。检查以确保每个渲染的视图至少都有一个容器来填充它。