如何在apollo客户端更新查询？

Question

假设我有一个简单的数据模型，如下图所示。

User
 - email
 - password
 - Profile
    - profile_image
    - address
    - phone_number

当我访问用户的个人资料页面时，我使用Query从服务器上查询用户。

const ME = gql`
  query {
    me {
      email
      profile {
        profileImage
        address
        phoneNumber
      }
  }
`; 
const {loading, data, refetch} = useQuery(ME);

而当我想更新个人资料时 我会这样做

const UPDATE_PROFILE = gql`
  mutation($profileImage: String!, $address: String!, $phoneNumber: String!) {
    updateProfile(profileImage: $profileImage, address: $address, phoneNumber: $phoneNumber) {
      profileImage
      address
      phoneNumber
    }
  }
`;

const [updateProfile, {loading}] = useMutation(UPDATE_PROFILE, {
  onCompleted(data) {
    // Refetch to refresh whole user data
    refetch();
  }
}

我只是想在页面中显示新更新的用户信息，所以我做的是调用 refetch() from useQuery(ME)。

但我发现，我可以从这个函数中使用refetchQueries()。文档.哪个会是更好的选择？它们之间有什么区别？

Answer 1

之间的区别 refetchQueries 和 refetch:

• refetchQueries你可以在变异后重新获取任何查询，包括你的。ME 查询或其他查询，如 getMessageList, getListUser,...

  refetchQueries 是更新缓存的最简单方法。有了 refetchQueries 你可以指定一个或多个查询，你想在突变完成后运行，以便重新获取可能受突变影响的存储部分 (refetchQueries doc).

• refetch注意：你可以直接重新获取查询 ME 当您使用 refetch 的结果之一。useQuery(ME).

  一个允许你重新读取查询的函数，并可选择传入新的变量(重取文件).

在你的情况下，如果你想重新获取你的 ME 数据，您可以使用 refetch. 另一方面，如果您想更新其他查询，您应该使用 refetchQueries. 根据我的经验，我更喜欢使用 refetchQueries 变异后使用 refetch.