Apollo 客户端 useMutation 挂钩中的 refetchQueries 问题
Issue with refetchQueries in the Apollo Client useMutation hook
我 运行 在尝试在我的 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
}
}
}
`;
自己找到了答案。虽然它看起来不像文档中的任何内容,但以下内容有效:
const handleMarkAsVIP = ( customerId: string ) => {
markAsVIP({
variables: { id: customerId, tags: [ 'VIP' ] },
refetchQueries: [
{ query: GET_CUSTOMERS },
'getCustomers'
]
})
}
我认为它说 属性 query
丢失了,所以我只是尝试用 query
属性 传递一个对象,认为它永远不会起作用,但是确实如此。
我 运行 在尝试在我的 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
}
}
}
`;
自己找到了答案。虽然它看起来不像文档中的任何内容,但以下内容有效:
const handleMarkAsVIP = ( customerId: string ) => {
markAsVIP({
variables: { id: customerId, tags: [ 'VIP' ] },
refetchQueries: [
{ query: GET_CUSTOMERS },
'getCustomers'
]
})
}
我认为它说 属性 query
丢失了,所以我只是尝试用 query
属性 传递一个对象,认为它永远不会起作用,但是确实如此。