Next / Apollo: как правильно обновить кеш apollo, если соответствующий запрос был запущен в getInitialProps - PullRequest
Новая
       27

Next / Apollo: как правильно обновить кеш apollo, если соответствующий запрос был запущен в getInitialProps

2 голосов
/ 21 сентября 2019

Я использую nextjs и apollo (с реагирующими хуками).Я пытаюсь обновить объект пользователя в кэше Apollo (я не хочу, чтобы повторно получить).Происходит то, что пользователь, кажется, обновляется в кеше просто отлично, но пользовательский объект, который использует компонент, не обновляется.Вот соответствующий код:

Страница: 

// pages/index.js

...

const Page = ({ user }) => {
  return <MyPage user={user} />;
};


Page.getInitialProps = async (context) => {
  const { apolloClient } = context;
  const user = await apolloClient.query({ query: GetUser }).then(({ data: { user } }) => user);

  return { user };
};

export default Page;

И компонент: 

// components/MyPage.jsx

...

export default ({ user }) => {
  const [toggleActive] = useMutation(ToggleActive, {
    variables: { id: user.id },
    update: proxy => {
      const currentData = proxy.readQuery({ query: GetUser });

      if (!currentData || !currentData.user) {
        return;
      }

      console.log('user active in update:', currentData.user.isActive);

      proxy.writeQuery({
        query: GetUser,
        data: {
          ...currentData,
          user: {
            ...currentData.user,
            isActive: !currentData.user.isActive
          }
        }
      });
    }
  });

  console.log('user active status:', user.isActive);

  return <button onClick={toggleActive}>Toggle active</button>;
};

Когда я постоянно нажимаю кнопку, консоль входит в обновлениеФункция показывает активный статус пользователя как переворачивание назад и вперед, поэтому кажется, что кеш apollo обновляется должным образом.Тем не менее, консольный журнал в компоненте всегда показывает одно и то же значение состояния.

Я не вижу, чтобы эта проблема возникала с любыми другими обновлениями кеша apollo, которые я делаю, когда получается объект данных, который использует компонентв компоненте с помощью хука useQuery (т.е. не из запроса в getInitialProps).

...