在 apollo react 客户端中使用 graphql 片段
Using graphql fragments in apollo react client
我正在构建一个反应本机应用程序(使用打字稿),我在其中使用 @apollo/client
v3。我有很多突变和查询,它们都是 return 相同的类型,而且我总是想接收相同的字段。因此,我为模式定义(在客户端)提出了以下结构:
import { gql } from "@apollo/client";
gql`
fragment ConversationFragment on Conversation {
roomId
name
isDirect
participants {
id
isAdmin
isCreator
membership
}
imageBlurhash
eventIds {
eventId
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_INITIATE = gql`
mutation conversationDirectInitiate($participantId: UUID!) {
conversationDirectInitiate(participantId: $participantId) {
...ConversationFragment
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_DELETE = gql`
mutation conversationDirectDelete($conversationId: UUID!) {
conversationDirectDelete(conversationId: $conversationId) {
delete
conversation {
...ConversationFragment
}
}
}
`;
... many more mutation and queries like the one above
如您所见,我尽量避免将字段重新键入 return。也许还有不同的方法可以达到这个结果?
但是,服务器响应错误:
{
"errors": [
{
"message": "Unknown fragment \"ConversationFragment\".",
"locations": [
{
"line": 3,
"column": 8
}
],
"extensions": {
"code": "GRAPHQL_VALIDATION_FAILED",
"exception": {
"stacktrace": [
"GraphQLError: Unknown fragment \"ConversationFragment\".",
" at Object.FragmentSpread (/node_modules/graphql/validation/rules/KnownFragmentNames.js:29:29)",
" at Object.enter (node_modules/graphql/language/visitor.js:324:29)",
" at Object.enter (node_modules/graphql/language/visitor.js:375:25)",
" at visit (node_modules/graphql/language/visitor.js:242:26)",
" at Object.validate (node_modules/graphql/validation/validate.js:73:24)",
" at validate (node_modules/apollo-server-core/src/requestPipeline.ts:513:14)",
" at Object.<anonymous> (node_modules/apollo-server-core/src/requestPipeline.ts:296:32)",
" at Generator.next (<anonymous>)",
" at fulfilled (node_modules/apollo-server-core/dist/requestPipeline.js:5:58)",
" at processTicksAndRejections (internal/process/task_queues.js:97:5)"
]
}
}
}
]
非常感谢任何帮助,在此先感谢您!
在每个文档的末尾插入您要使用的片段。
import { gql } from "@apollo/client";
const CONVERSATION_FRAGMENT = gql`
fragment ConversationFragment on Conversation {
roomId
name
isDirect
participants {
id
isAdmin
isCreator
membership
}
imageBlurhash
eventIds {
eventId
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_INITIATE = gql`
mutation conversationDirectInitiate($participantId: UUID!) {
conversationDirectInitiate(participantId: $participantId) {
...ConversationFragment
}
}
${CONVERSATION_FRAGMENT}
`;
export const MUTATE_CONVERSATION_DIRECT_DELETE = gql`
mutation conversationDirectDelete($conversationId: UUID!) {
conversationDirectDelete(conversationId: $conversationId) {
delete
conversation {
...ConversationFragment
}
}
}
${CONVERSATION_FRAGMENT}
`;
我正在构建一个反应本机应用程序(使用打字稿),我在其中使用 @apollo/client
v3。我有很多突变和查询,它们都是 return 相同的类型,而且我总是想接收相同的字段。因此,我为模式定义(在客户端)提出了以下结构:
import { gql } from "@apollo/client";
gql`
fragment ConversationFragment on Conversation {
roomId
name
isDirect
participants {
id
isAdmin
isCreator
membership
}
imageBlurhash
eventIds {
eventId
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_INITIATE = gql`
mutation conversationDirectInitiate($participantId: UUID!) {
conversationDirectInitiate(participantId: $participantId) {
...ConversationFragment
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_DELETE = gql`
mutation conversationDirectDelete($conversationId: UUID!) {
conversationDirectDelete(conversationId: $conversationId) {
delete
conversation {
...ConversationFragment
}
}
}
`;
... many more mutation and queries like the one above
如您所见,我尽量避免将字段重新键入 return。也许还有不同的方法可以达到这个结果?
但是,服务器响应错误:
{
"errors": [
{
"message": "Unknown fragment \"ConversationFragment\".",
"locations": [
{
"line": 3,
"column": 8
}
],
"extensions": {
"code": "GRAPHQL_VALIDATION_FAILED",
"exception": {
"stacktrace": [
"GraphQLError: Unknown fragment \"ConversationFragment\".",
" at Object.FragmentSpread (/node_modules/graphql/validation/rules/KnownFragmentNames.js:29:29)",
" at Object.enter (node_modules/graphql/language/visitor.js:324:29)",
" at Object.enter (node_modules/graphql/language/visitor.js:375:25)",
" at visit (node_modules/graphql/language/visitor.js:242:26)",
" at Object.validate (node_modules/graphql/validation/validate.js:73:24)",
" at validate (node_modules/apollo-server-core/src/requestPipeline.ts:513:14)",
" at Object.<anonymous> (node_modules/apollo-server-core/src/requestPipeline.ts:296:32)",
" at Generator.next (<anonymous>)",
" at fulfilled (node_modules/apollo-server-core/dist/requestPipeline.js:5:58)",
" at processTicksAndRejections (internal/process/task_queues.js:97:5)"
]
}
}
}
]
非常感谢任何帮助,在此先感谢您!
在每个文档的末尾插入您要使用的片段。
import { gql } from "@apollo/client";
const CONVERSATION_FRAGMENT = gql`
fragment ConversationFragment on Conversation {
roomId
name
isDirect
participants {
id
isAdmin
isCreator
membership
}
imageBlurhash
eventIds {
eventId
}
}
`;
export const MUTATE_CONVERSATION_DIRECT_INITIATE = gql`
mutation conversationDirectInitiate($participantId: UUID!) {
conversationDirectInitiate(participantId: $participantId) {
...ConversationFragment
}
}
${CONVERSATION_FRAGMENT}
`;
export const MUTATE_CONVERSATION_DIRECT_DELETE = gql`
mutation conversationDirectDelete($conversationId: UUID!) {
conversationDirectDelete(conversationId: $conversationId) {
delete
conversation {
...ConversationFragment
}
}
}
${CONVERSATION_FRAGMENT}
`;