使用flatList做列表頁上拉加載等多功能，主要使用以下兩個屬性：

• onEndReached：當列表被滾動到距離內容最底部不足onEndReachedThreshold的距離時調用。

• onEndReachedThreshold：決定當距離內容最底部還有多遠時觸發onEndReached回調。<font size=3 color=#D2691E>其值是表示百分比的數值。</font>

使用過程中遇到以下兩個問題：

問題一： flatList初始化數據時首次請求的數據較少，flatList高度較小，多次觸發onEndReached問題，直到請求的數據滿足onEndReachedThreshold的設置。

通過設置FlatList的配置無法解決此問題。

情況一： 多頁數據，設置每頁請求數據數量可以鋪滿整屏

情況二： 當只有一頁且數量較少時，通過設置特殊字段，退出onEndTouch回調。如下代碼所示：

_onEndReached = () => {
    const {isENd} = this.props //isEnd 表示當前是數據請求的最后一頁
  if(isENd) return;
  ...
};

問題二： flatList上拉刷新觸發onEndTouch問題

解決方案： onScrollEndDrag 和 onMomentumScrollEnd 將標志字段置為false，退出onEndTouch回調，僅允許onScrollBeginDrag 和 onMomentumScrollBegin 情況正常調用onEndTouch回調。如下代碼所示：

<FlatList
  ...
  onEndReached={this._onEndReached}
  onEndReachedThreshold={0.2}
  onScrollBeginDrag={() => {
    console.log('onScrollBeginDrag');
    this.canAction = true;
  }}
  onScrollEndDrag={() => {
    console.log('onScrollEndDrag');
    this.canAction = false;
  }}
  onMomentumScrollBegin={() => {
    console.log('onMomentumScrollBegin');
    this.canAction = true;
  }}
  onMomentumScrollEnd={() => {
    console.log('onMomentumScrollEnd');
    this.canAction = false;
  }}
/>

_onEndReached = () => {
  console.log('_onEndReached');
  if(!this.canAction) return;
  ...
};