相关疑难解决方法(0)

FlatList onEndReached被多次调用

我正在做一个本机反应项目,用户可以使用Flickr API搜索图像,其他所有工作都很好,但是实现分页时遇到了问题。我已经使用FlatList onEndReached来检测用户何时滚动到列表的末尾,但是问题onEndReached却被调用了多次(包括第一次渲染期间)。我什至已禁用弹跳,如此处所说但仍被多次调用

 export default class BrowserHome extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isLoading: false,
      tagParam: "cat",
      pageNum: -1,
      data: [],
      photosObj: ""
    };
  }

  componentDidMount() {
    this.setState({
      isLoading: true
    });
    try {
      this.makeRequest();
    } catch {
      console.log("error has occurred");
    }
  }

  makeRequest = () => {
    const { tagParam, pageNum } = this.state;
    let url = `https://api.flickr.com/services/rest/? 
               method=flickr.photos.search
               &api_key=${apiKey}&format=json&tags=${tagParam}
               &per_page=30&page=${pageNum + 1}&nojsoncallback=1`;
    fetch(url, {
      method: "GET"
    })
      .then(response => response.json())
      .then(responseJSON …
Run Code Online (Sandbox Code Playgroud)

reactive-programming ios react-native react-native-flatlist

11
推荐指数
5
解决办法
5087
查看次数

ScrollView 中的 React Native FlatList onEndReached 从未调用过

我的容器是一个滚动视图,里面是一个平面列表,它从服务器加载数据。

平面列表:

<VirtualizedList
  ListEmptyComponent={<NoData />}
  data={data}
  getItem={(items, index) => items.get(index)}
  getItemCount={(items) => items.size}
  keyExtractor={(item, index) => String(index)}
  renderItem={this._renderItem}
  refreshControl={
     <RefreshControl
       refreshing={loading}
       onRefresh={this._onRefresh.bind(this)}
     />
  }
  onEndReached={this.handleLoadMore}
  onEndReachedThreshold={0.1}
  onMomentumScrollBegin={() => {
    Log('onMomentumScrollBegin fired!')
    this.onEndReachedCalledDuringMomentum = false;
  }}
/>
Run Code Online (Sandbox Code Playgroud)

handleLoadMore是:

handleLoadMore = () => {
  Log('handleLoadMore fired!');
  if (!this.onEndReachedCalledDuringMomentum) {
    // fetch data..
    this.onEndReachedCalledDuringMomentum = true;
  }
}
Run Code Online (Sandbox Code Playgroud)

问题是handleLoadMore从未被调用和onMomentumScrollBegin也从未被调用。

怎么解决这个问题呢?

react-native react-native-flatlist

6
推荐指数
1
解决办法
7580
查看次数

React本机列表视图onEndReached多次调用

我在反应原生中使用List View onEndReached组件时遇到了一些麻烦.

渲染代码:

@autobind
  _fetchMoreHistory(){

    console.log("Fetch more history called");

  }

<View style={[styles.Ctr]}>
   <ListView dataSource={this.state.txHistorySource}
         renderRow={ this._renderRow }
         onEndReached ={ this._fetchMoreHistory }
         onEndReachedThreshold  = {10}/>
</View>
Run Code Online (Sandbox Code Playgroud)

我打开屏幕的那一刻_fetchMoreHistory被调用两次并在onEndReached达到之后正常工作.有人可以帮忙调试吗?

javascript reactjs react-native

5
推荐指数
2
解决办法
4093
查看次数