0
我正在一個應用程序中執行分頁,除loading
標誌在fetchMore
操作期間沒有更新以外,所有程序都可以正常工作。反應阿波羅客戶端不使用fetchMore()更新加載標誌。爲什麼?
看來,fetchMore
不會導致重新渲染,直到它返回,這意味着該標誌永遠不會更改爲true
。
我已經仿照我的代碼爲偏置/極限例如在:http://dev.apollodata.com/react/pagination.html
有涉及保留一些國家的賽道有些類似的問題,但我寧願不添加更多的標誌和使用提供了一個。
...
render() {
if (!this.props.loading) {
const hasNext = false);
const canLoadMore = hasNext && !this.props.loading;
return (
<div>
...
<LoadMoreButton
onHandleLoadMore={this.props.handleLoadMore}
canLoadMore={canLoadMore}
loading={this.props.loading} // <- this doesn't change because component doesn't re-render until results are back
/>
</div>
);
}
}
...
const queryOptions = {
options: props => ({
variables: {
offset: 0,
limit: 5,
}
}),
props ({ data: { loading, fetchMore } }) {
return {
loading,
handleLoadMore() {
return fetchMore({
variables: {
offset: nextOffset,
limit: limit,
},
updateQuery: (previousResult, { fetchMoreResult }) => {
if (!fetchMoreResult) {
return previousResult;
}
return update(previousResult, {
{...}
});
}
});
},
};
},
};