使用Apollo客户端更新缓存的数据-ReactJS

如何解决使用Apollo客户端更新缓存的数据-ReactJS

我正在尝试使用ReactJs，GraphQL和NodeJs构建一个HackerNews克隆，到目前为止，我能够实现许多功能，但是在尝试更新链接以使用户看到该链接时我陷入了困境更改而无需更新页面。与该过程相关的两个查询是变量Vote_MUTATION，它使用户可以对我的查询LINKS_Feed中的链接进行投票。它可以工作，但是我必须刷新页面才能看到更改。这就是我试图做的

查询

变异Vote_MUTATION

export const Vote_MUTATION = gql`
  mutation VoteMutation($linkId: ID!) {
    Vote(linkId: $linkId) {
      id
      link {
        id
        Votes {
          id
          user {
            id
          }
        }
      }
      user {
        id
      }
    }
  }
`;

查询LINKS_Feed

export const LINKS_Feed = gql`
  query LinksFeed {
    Feed {
      count
      links {
        id
        description
        url
        postedBy {
          id
          name
        }
        Votes {
          id
          user {
            name
          }
        }
      }
    }
  }

这就是我的API调用的样子

 const [upVoteLink,{ data }] = useMutation(Vote_MUTATION);

  const VoteLink = async (linkId) => {
    try {
      await upVoteLink({
        variables: { linkId },update: (cache,{ upVoteLink }) => {
          const currentData = cache.readQuery({ query: LINKS_Feed });
          const newData = {...currentData}
          newData.Feed = {...currentData.Feed}
          newData.Feed.links = [...currentData.Feed.links,upVoteLink];
          cache.writeQuery({ query: LINKS_Feed },newData);
        },});
    } catch (err) {
      alert(err.message);
    }
  };