【问题标题】:Issue with refetchQueries in the Apollo Client useMutation hookApollo 客户端 useMutation 挂钩中的 refetchQueries 问题
【发布时间】:2021-10-06 14:45:58
【问题描述】:

我在尝试在我的 useMutation 挂钩中定义 refetchQueries 时遇到以下错误。

Type 'DocumentNode' is not assignable to type 'string | PureQueryOptions'.  
Property 'query' is missing in type 'DocumentNode' but required in type 'PureQueryOptions'.

我不确定我做错了什么,因为官方的 Apollo 文档有点不清楚,而且我在谷歌搜索时找不到任何优先级。

据我了解,我的 GraphQL 查询中缺少属性 query。我是否将正确的值传递给refetchQueries?我认为我做得对,但我不知道为什么它抱怨query 不是其中的一部分。

代码

import { useMutation, useQuery } from '@apollo/client';
import { GET_CUSTOMERS, MARK_AS_VIP } from './queries';

export default function Customers() {
  const [ markAsVIP, { data: vips, loading: vipLoading, error: vipError } ] = useMutation( MARK_AS_VIP );
  const { loading, error, data: getCustomerResp } = useQuery( GET_CUSTOMERS );

  const handleMarkAsVIP = ( customerId: string ) => {
    markAsVIP( {
      variables: { id: customerId, tags: [ 'VIP' ] },
      refetchQueries: [
        GET_CUSTOMERS, // error shows here
        'getCustomers'
      ]
    } )
  }
}

查询

import { gql } from '@apollo/client';

export const GET_CUSTOMERS = gql`
  query getCustomers {
      customers( first: 50 ) {
          edges {
              cursor
              node {
                  id
                  displayName
                  tags
              }
          }
      }
  }
  `;

export const MARK_AS_VIP = gql`
    mutation markAsVIP( $id: ID!, $tags: [String!]! ) {
        tagsAdd( id: $id, tags: $tags ) {
            node {
                id
            }
            userErrors {
                field
                message
            }
        }
    }
`;

【问题讨论】:

    标签: reactjs graphql apollo-client react-apollo graphql-mutation


    【解决方案1】:

    自己找到了答案。尽管它看起来不像文档中的任何内容,但以下内容有效:

    const handleMarkAsVIP = ( customerId: string ) => {
      markAsVIP({
        variables: { id: customerId, tags: [ 'VIP' ] },
        refetchQueries: [
           { query: GET_CUSTOMERS },
          'getCustomers'
        ]
      })
    }
    

    我认为它说属性 query 丢失了,所以我只是尝试使用 query 属性传递一个对象,认为它永远不会起作用,但它确实如此。

    【讨论】:

    • 谢谢!我有完全相同的问题,但无法弄清楚:D
    • 存在一个问题,即您的 GET_CUSTOMERS 查询在没有最近提供的一组变量的情况下也能正常工作。
    • 谢谢...我很惊讶没有在官方文档中看到这一点。
    猜你喜欢
    • 2021-04-04
    • 2019-02-17
    • 1970-01-01
    • 2020-03-16
    • 2019-01-12
    • 2020-04-02
    • 2020-03-01
    • 2020-06-04
    • 2020-06-06
    相关资源
    最近更新 更多