無法在React Native Flatlist組件中運行onEndReached

Question

這是我的代碼：

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);

無論我嘗試什么，當flatlist結束時，我都無法運行我的函數loadMoreNews 。

這讓我瘋狂！ 我已經嘗試了所有stackoverflow問題和答案，但我無法理解為什么我無法運行該功能。

我希望能夠走到盡頭，以便可以添加基於無限滾動的功能。

Answer 1

loadMoreNews應該是箭頭功能或使用bind方法。 請按以下方式更新loadMoreNews ：

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

Answer 2

嘗試設置onEndReachedThreshold並像這樣使用。

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