Question

我有用户和用户更新表格，但是问题是，突变后Web应用程序中的用户数据没有更新。

变异：

  mutation UserUpdate($user: UserUpdateInput!, $id: String!) {
    userUpdate(user: $user, id: $id) {
      id
    }
  }

查询：

  query UsersItemQuery($id: String!) {
    userById(id: $id) {
      id
      email
      datetime
      firstName
      lastName
      middleName
      phone
      role
      podcasts {
        id
        title
      }
    }
  }

我在UserItem.tsx组件上使用它：

const usersItem = useQuery<UsersItemQuery, UsersItemQueryVariables>(usersItemQuery, { variables })

usersItem突变后的问题与以前相同，但是刷新页面后问题变得正确了

Answer 1

您似乎假设缓存是从您的输入类型更新的。尽管这看起来似乎是智能缓存可以完成的事情，但我们必须记住，GraphQL不对突变的形状和已更新的内容做出任何假设。并非所有的突变都遵循 UpdateInputObject + ID 的简单模式。因此，只有实现才知道真正更新的内容，并且客户端对此进行假设可能会真的出错。该实现可以通过提供下一节中讨论的结果类型来提示有关哪些对象已更新的信息。

GraphQL允许我们让变异返回包含更新项的有效负载。返回所有更新的项目成为良好的变异设计任务。

您的模式似乎允许在更新的用户上获取字段，但是您的变异不查询任何更新的字段。您应该获取应用程序所需的所有字段（例如，通过在userById查询和变异中使用相同的片段），或者简单地获取通过该变异更新的所有字段：

  mutation UserUpdate($user: UserUpdateInput!, $id: String!) {
    userUpdate(user: $user, id: $id) {
      email
      datetime
      firstName
      lastName
      middleName
      phone
      role
      podcasts {
        id
        title
      }
    }
  }

另一件事：假设您处于每个字节都很重要的特定情况下（也许您正在开发极低带宽的应用），从技术上讲，可以进行您期望的更新手动使用cache reads and writes。这通常适用于您的突变未返回更新的所有内容的情况。在这种情况下，我不建议您使用它，但对于其他阅读此文章并尝试明确获得此行为的人可能会有帮助。

React Apollo突变后不更新数据

1 个答案: