我正在做一个本机反应项目,用户可以使用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) 我的容器是一个滚动视图,里面是一个平面列表,它从服务器加载数据。
平面列表:
<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也从未被调用。
怎么解决这个问题呢?
我在反应原生中使用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达到之后正常工作.有人可以帮忙调试吗?