无法在 React Native Flatlist 组件中运行 onEndReach



这是我的代码:

import React, { Component } from "react";
import { View, FlatList } from "react-native";
import { connect } from "react-redux";
import { newsFetch } from "../actions";
import NewsCard from "../components/NewsCard";
import Spinner from "../components/Spinner";
var self;
class NewsScreen extends Component {
    constructor(props) {
        super(props);
        this.state = {
            pageNo: 1,
            refreshing: false,
        };
    }
    componentDidMount() {
        this.props.newsFetch();
        self = this;
    }
    renderNewsCard({item}) {
        // console.log(self.props.navigation);
        return(
            <NewsCard item={item} navigationProp={self.props.navigation} />
        );
    }
    loadMoreNews() {
        console.log("Loading more...");
    }
    renderNewsList() {
        if(this.props.loading) { 
            return(
                <Spinner />
            );
        }
        return(
            <FlatList
                    data={this.props.news.news}
                    renderItem={this.renderNewsCard} 
                    keyExtractor={item => item.id.toString()}
                    // No matter whatever I do, I am not able to run this :
                    onEndReached= {this.loadMoreNews}
                    onEndReachedThreshold={0}
            />
        );
    }
    render () {
        return (
            <View>
                {this.renderNewsList()}
            </View>
        );
    }
}
const mapStateToProps = state => {
    return {
        news: state.news,
        loading: state.news.loading,
    };
};
export default connect(mapStateToProps, { newsFetch })(NewsScreen);

无论我尝试什么,我都无法loadMoreNews flatlist结束时运行我的函数。

它让我发疯!我已经尝试了所有堆栈溢出问题和答案,但我无法理解为什么我无法运行该功能。

我希望能够到达终点,以便我可以添加基于无限滚动的功能。

loadMoreNews应该是箭头函数或使用绑定方法。请按如下方式更新loadMoreNews

...
  loadMoreNews = () => {
    console.log("Loading more...");
  }
...

尝试设置 onEndReachedThreshold 并像这样使用。

 onEndReached={_.debounce(this.endScroll, 500)} 
 onEndReachedThreshold={0.2}

相关内容

  • 没有找到相关文章

最新更新