PWA Studio에서 사용자 작업에 대한 Aporo 질의

1823 단어 javascriptgraphql
일부 용례에서 사용자 작업의GraphQL 조회를 다시 그려야 합니다.이렇게 하려면 <query> 구성 요소에 데이터를 다시 새겨야 합니다.코드 라이브러리의 다른 부분에서 이 점을 터치하는 것은 매우 어려울 것이다.
예를 들면 다음과 같습니다.
저는 B2B 인터넷 쇼핑몰이 하나 있습니다.고객은 제품 페이지에서 일반/일반 가격을 볼 수 있습니다.그러나 제품 정보/가격에 로그인할 때 그의 특수 정보/가격을 반영하기 위해 업데이트가 필요하다.
전체 페이지와 조회를 강제로 다시 불러오거나 Apolloclient.resetStore()를 사용할 수 있는 페이지를 다시 불러오는 것 외에 간단한 방법은 없지만, 전체 저장을 재설정하고 모든 활성 조회를 다시 읽을 수 있습니다.
더 많은 수술을 하기 위해서 우리는 이 부분과 유사한 것을 사용할 수 있다.
// refetchQueriesByName.js

const findQueries = (manager, names) => {
    const matching = [];
    manager.queries.forEach(q => {
        if (q.observableQuery && names.includes(q.observableQuery.queryName)) {
            matching.push(q);
        }
    });
    return matching;
};

export const refetchQueriesByName = (names, client) => {
    return Promise.all(
        findQueries(client.queryManager, names).map(q =>
            q.observableQuery.refetch(),
        ),
    );
};
구현
// packages/peregrine/lib/talons/SignIn/useSignIn.js

import { refetchQueriesByName } from 'PATH_TO/refetchQueriesByName';

    const handleSubmit = useCallback(
        async ({ email, password }) => {
            setIsSigningIn(true);
            try {

                ...

                // Place somewhere after 'const destinationCartId = await retrieveCartId();'


                // These names are the actual names you declared in your graphql files
                await refetchQueriesByName(
                    [
                        'productDetail',
                        'relatedProducts',
                    ],
                    apolloClient
                ); 

                ...

})

좋은 웹페이지 즐겨찾기