【问题标题】:Store error: the application attempted to write an object with no provided typename but the store already contains an object存储错误:应用程序试图写入一个没有提供类型名的对象,但存储已经包含一个对象
【发布时间】:2020-09-05 05:15:29
【问题描述】:

当我更新缓存时发生突变后,更改会反映在 UI 中,但出现以下错误

Invariant Violation: Store error: 应用程序试图写入一个没有提供类型名的对象,但存储已经包含一个类型名为 ItemCodeConnection 的对象,用于 id $ROOT_QUERY.itemCodes({"filter":{"number" :10000001}})。试图写入的 selectionSet 是: {"kind":"Field","name":{"kind":"Name","value":"itemCodes"},"arguments":[{"kind":"Argument","name":{ "kind":"Name","value":"filter"},"value":{"kind":"Variable","name":{"kind":"Name","value":"filter" }}}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name ","value":"itemCodes"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread ","name":{"kind":"Name","value":"itemCodeTile"},"directives":[]},{"kind":"Field","name":{"kind": "名称","值":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]} }

GraphQL 查询:

const CREATE_ITEM_CODE_SPEC = gql`
mutation createItemCodeSpec($input: createItemCodeSpecInput) {
    createItemCodeSpecification(input: $input){
        __typename
        id
        itemCode {
            number
        }
        product
        spec_class
        grade
    }
}
`

const GET_ITEM_CODE  = gql`
    query itemCode($filter: filterInput){
        itemCodes(filter: $filter){
            itemCodes {
                number
                type
                description
                group 
                item_code_spec {
                    id
                    itemCode {
                        number
                    }
                product
                spec_class
                grade
           }
             created_on
             created_by
             changed_on
             changed_by      
            }
        }
    }
`

下面是突变:

const [mutation, { data, loading, error}] = useMutation(
        CREATE_ITEM_CODE_SPEC,
        {
            update(cache, { data: { createItemCodeSpecification } }){
                const currentData  = cache.readQuery({
                    query: GET_ITEM_CODE,
                    variables: { filter : {number:itemCode} } 
                })
                cache.writeQuery({
                    query: GET_ITEM_CODE,
                    variables: { filter : {number:itemCode} },
                    data: {
                        ...currentData,
                        itemCodes: {
                            itemCodes: currentData.itemCodes.itemCodes.map((itemCode, index) => {
                                return {
                                    ...itemCode,
                                    item_code_spec: index === 0? [
                                        ...itemCode.item_code_spec,
                                        createItemCodeSpecification
                                     ] : itemCode.item_code_spec
                                }
                            })
                        }
                    }
                }) 
            }
        }
        );

【问题讨论】:

    标签: graphql apollo apollo-client


    【解决方案1】:

    您只需为查询的每个子部分添加“id”。在 GET_ITEM_CODE 查询中为“itemCodes”添加“id”可能会解决您的问题。

    【讨论】:

      【解决方案2】:

      您的响应突变中缺少字段。

      基本上,您应该让您的变异结果包含更新之前获取的查询所需的所有数据。

      这也是使用片段在所有相关查询和突变之间共享字段的最佳做法的原因。

      要使其正常工作,查询和变异都应该具有完全相同的字段。

      查看此处以更深入地了解缓存更新的工作原理: https://medium.com/free-code-camp/how-to-update-the-apollo-clients-cache-after-a-mutation-79a0df79b840

      【讨论】:

      • 在这里你可以看到,我通过突变在 itemCodes 的 item_code_spec 字段中添加了新条目。如果您查看我的查询,所有字段都存在于 itemCodes 的 item_code_spec 字段中的响应中。但是我收到 itemCodes 中缺少类型名称的错误。另一件事,number 用作 itemCodes 的 id(自定义 dataIdFromObject)和 item_code_spec 的 id。此设置是否导致问题@Ric0
      猜你喜欢
      • 2019-07-24
      • 2021-07-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-08-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多