Question

成功执行突变后，我正在尝试更新我的检查。这是我的查询和变更：

export const Dojo_QUERY = gql`
query Dojo($id: Int!){
  dojo(id: $id){
    id,
    name,
    logoUrl,
    location {
     id,
     city,
     country
    },
    members{
      id
    },
    disziplines{
      id,
      name
    }
  } 
}`;


export const addDiszipline_MUTATION = gql`
mutation createDisziplin($input:DisziplineInput!,$dojoId:Int!){
  createDisziplin(input:$input,dojoId:$dojoId){
    disziplin{
     name,
     id
    }
  }
}`;

我的突变电话：

const [createDisziplin] = useMutation(Constants.addDiszipline_MUTATION,
    {
      update(cache, { data: { createDisziplin } }) {
        console.log(cache)
        const { disziplines } = cache.readQuery({ query: Constants.Dojo_QUERY,variables: {id}});
        console.log(disziplines)
        cache.writeQuery({
        ...some update logic (craches in line above)
        });
      }
    }
    );

执行此突变时出现错误

Invariant Violation: "Can't find field dojo({"id":1}) on object {
  "dojo({\"id\":\"1\"})": {
    "type": "id",
    "generated": false,
    "id": "DojoType:1",
    "typename": "DojoType"
  }
}."

在我的客户端缓存中，我可以看到

data{data{DojoType {...WITH ALL DATA INSIDE APPART FROM THE NEW DISZIPLINE}}

和

data{data{DisziplineType {THE NEW OBJECT}}

网络上的客户端缓存似乎有很多混乱。不知何故，摆在我面前的解决方案都无济于事。任何帮助将不胜感激。

编辑1： 也许可以帮上忙吗？

ROOT_QUERY: {…}
"dojo({\"id\":\"1\"})": {…}
generated: false
id: "DojoType:1"
type: "id"
typename: "DojoType"
<prototype>: Object { … }
<prototype>: Object { … }

编辑2

我接受了Herku的建议并开始使用片段。但是它似乎仍然无法正常工作。

我的代码：

 const [createDisziplin] = useMutation(Constants.addDiszipline_MUTATION,
    {
      update(cache, { data: { createDisziplin } }) {
        console.log(cache)
        const { dojo } = cache.readFragment(
          { fragment: Constants.Diszilines_FRAGMENT,
            id:"DojoType:"+id.toString()});
        console.log(dojo)
      }
    }
    );

与

export const Diszilines_FRAGMENT=gql`
  fragment currentDojo on Dojo{
    id,
    name,
    disziplines{
      id,
      name
    }
  }
`;

但是console.log(dojo)的结果仍然不确定。有任何建议吗？

Answer 1

因此，我认为您的实际错误是必须将ID作为字符串提供：variables: {id: id.toString()}。您会看到这两行是不同的：

dojo({\"id\":1})
dojo({\"id\":\"1\"})

但是我强烈建议使用readFragment而不是readQuery并使用提供的ID更新dojo。这也将更新查询以及在所有查询中出现的所有其他dojo。您可以在readFragment here上找到文档。

还有另一个技巧，就是简单地在突变响应中返回整个dojo。我要说的是，人们应该不那么担心并且不要对高速缓存进行太多更新，因为高速缓存更新是类型系统中不存在的API的隐式行为。新的disziplin可以在disziplins字段中找到，现在已在前端进行了编码。想象一下，您想在这里添加新的步骤，新的Disziplin必须首先获得批准，然后才能在那里发布。如果变异返回整个dojo，则只需进行简单的后端更改即可完成工作，并且您的客户不必知道这种行为。

变异后React Apollo更新客户端缓存

1 个答案: