Как обработать ошибку в fetchMore pagination? - PullRequest
Новая
       4

Как обработать ошибку в fetchMore pagination?

0 голосов
/ 30 января 2019

Я пытаюсь использовать fetchMore с реагировать на бесконечность прокрутки (https://www.npmjs.com/package/react-infinite-scroller).. Это работает большую часть времени, но я хочу быть в состоянии отловить ошибку сервера и обработать ее. Я говорю о службе, которая«сильно душит» меня, так что я хочу подождать 1сек и попробовать еще раз.

Моя проблема в том, что я не знаю, где обработать ошибку, если она выдается в fetchMore, поскольку она непередан в функцию рендеринга.

Я попытался использовать try / catch для самой функции fetchMore, я не уловил ошибки.

Я использую nextjs, если это помогает. 

return (
    <Query query={GET_COLLECTION} variables={{ handle: collectionHandle, first: 10, orderBy: orderBy }}>
        {({ loading, error, data, fetchMore, refetch }) => {
            if (loading && !data.getCollection) return <CollectionListLoader />
            // Normally I refetch in handleError
            if (error) return handleError({ error, loader: <Loader fullscreen={true} type="logo" />, refetch })

            const collection = data.getCollection

            return (
                <InfiniteScroll
                    initialLoad={false}
                    loadMore={() => {
                        fetchMore({
                            query: GET_MORE_COLLECTION,
                            variables: { handle: collectionHandle, first: 10, after: collection.products[collection.products.length - 1].cursor, orderBy: orderBy },
                            updateQuery: appendQuery,
                        })
                    }}
                    hasMore={collection.productsHasNextPage}
                    loader={<Loader type="logo" key="loader" />}
                >
                    <div className="row">
                        {collection.products.map((p, i) => {
                            return (
                                <div className="col-6 col-md-4" key={i}>
                                    <Product product={p} collectionHandle={collectionHandle} />
                                </div>
                            )
                        })}
                    </div>
                </InfiniteScroll>
            )
        }}
    </Query>
)

Факт: если в fetchMore выдается ошибка, бесконечный скроллер загружается неопределенно, и я не могу обработать ошибку

Ожидается: если в fetchMore выдается ошибка, я ее отлавливаю и могу ее обработать

1 Ответ

0 голосов
/ 28 мая 2019

Это, похоже, не задокументировано Apollo, но fetchMore возвращает обещание, чтобы вы могли обрабатывать ошибки с .catch().

...