Как использовать мутацию GraphQL в Next. js без useMutation

Question

Я работаю над кодовой базой с Next.js версии 9.3.0 и GraphQL. Чтобы воспользоваться преимуществами оптимизации Next. js, мы оборачиваем каждую страницу в withApollo, поэтому внутри страниц мы можем использовать useQuery, useMutation. Проблема, с которой я столкнулся, заключается в том, что мне нужно использовать мутацию в Header component, который находится за пределами страницы, у которого нет доступа к ApolloClient, потому что приложение не упаковано в withApollo.

Я получаю следующую ошибку: Could not find "client" in the context or passed in as an option. Wrap the root component in an <ApolloProvider>, or pass an ApolloClient instance in via options.

Компонент Header находится внутри компонента Layout следующим образом:

<>
   <Meta />
   <Header/>
   {children} // pages which are composed with withApollo
   <Footer />
</>

Вместо использования useQuery в компонент без withApollo легко использовать

import { createApolloFetch } from 'apollo-fetch';

const fetch = createApolloFetch({
    uri: process.env.GRAPHQL_SERVER,
});

const userInfoQuery = `{
    userInfo {
        loggedIn
        basketCount
        wishListCount
    }
}`;

const userInfoData = fetch({
      query: userInfoQuery,
});

Есть ли альтернативное решение для useMutation в компоненте, не составленном с withApollo?

Любые предложения приветствуются, Ура

Answer 1

Глупый, мутации тоже работают с Apollo fetch

https://github.com/apollographql/apollo-fetch#simple -graphql-mutation-with-variables но это больше не поддерживается

Решение, которое у меня работало, в итоге было еще useMutation и передать клиента ему. https://www.apollographql.com/docs/react/data/mutations/#usemutation -api

import { useMutation } from '@apollo/react-hooks';
import createApolloClient from 'lib/apolloClient';
import loginUser from 'mutations/login';

const [getToken, { data: mutationData, error: loginErrors, loading }] = useMutation(loginUser, { client: createApolloClient()});