我有一个图库,想要实现无限滚动,
当我到达页面末尾时,我有了一个事件处理程序, 然后调用getImages函数,该函数连接到服务器并加载100张图像,
由于某种原因,它无法加载图像,甚至(组件的)图像列表也没有使用新图像进行更新,
这可能与以下事实有关:在其余的API调用中,PER_PAGE的上限为100?
谢谢
getImages(tag) {
if(this.state.isLoading)
{
return;
}
this.setState({isLoading: true});
const getImagesUrl = `services/rest/?method=flickr.photos.search&api_key=522c1f9009ca3609bcbaf08545f067ad&tags=${tag}&tag_mode=any&per_page=100&format=json&safe_search=1&nojsoncallback=1`;
const baseUrl = '------------';
axios({
url: getImagesUrl,
baseURL: baseUrl,
method: 'GET'
})
.then(res => res.data)
.then(res => {
if (
res &&
res.photos &&
res.photos.photo &&
res.photos.photo.length > 0
) {
this.setState({images: res.photos.photo});
}
});
}
handleScroll = (e) => {
const el = e.target.documentElement;
const bottom = el.scrollHeight - el.scrollTop === el.clientHeight;
if (bottom) {
this.getImages(this.props.tag);
this.setState({isLoading: false})
}
}