我正在尝试使用一个变量将limit作为参数传递给我的GraphQL查询。我在Next应用程序中使用urql和Strapi及其GraphQL插件。
我想添加一个limit变量来限制返回的行。我将在下面提供一个示例，然后是完整的错误代码。
这项工作
import { useQuery } from 'urql'
const GET_RECENT_POSTS_QUERY = `
query {
posts (sort: "publishedAt:DESC") {
data {
attributes {
publishedAt
title
}
}
}
}
`
export default function Example() {
const [res] = useQuery({
query: GET_RECENT_POSTS_QUERY,
})
return (
<div>
<h3>Recent Posts</h3>
<div>{JSON.stringify(res)}</div>
</div>
)
}
`
结果
Recent Posts
{"fetching":false,"stale":false,"data":{"posts":{"data":[{"attributes":{"publishedAt":"2022-09-21T05:17:29.483Z","title":"Post Number 5","__typename":"Post"},"__typename":"PostEntity"},{"attributes":{"publishedAt":"2022-09-21T05:17:13.087Z","title":"Post Number 3 ","__typename":"Post"},"__typename":"PostEntity"},{"attributes":{"publishedAt":"2022-09-20T20:08:05.611Z","title":"Post Number 4","__typename":"Post"},"__typename":"PostEntity"},{"attributes":{"publishedAt":"2022-09-01T21:04:03.717Z","title":"My Second Post","__typename":"Post"},"__typename":"PostEntity"},{"attributes":{"publishedAt":"2022-09-01T19:22:20.413Z","title":"My First Post","__typename":"Post"},"__typename":"PostEntity"}], ...and so on
我试图传入一个变量来限制返回的结果数。
无效-传入变量
我尝试了各种方法，主要是围绕这样的事情。
const GET_RECENT_POSTS_QUERY = `
query ($limit: Int!){
posts (limit: $limit, sort: "publishedAt:DESC") {
data {
attributes {
publishedAt
title
}
}
}
}
`
export default function Example() {
const [res] = useQuery({
query: GET_RECENT_POSTS_QUERY,
variables: { limit: 3 },
})
// ...
结果/错误
错误开始于：
"error":{"name":"CombinedError","graphQLErrors":[{"message":"Unknown argument "limit" on field "Query.posts"
完全错误：
Recent Posts
{"fetching":false,"stale":false,"error":{"name":"CombinedError","graphQLErrors":[{"message":"Unknown argument "limit" on field "Query.posts".","extensions":{"code":"GRAPHQL_VALIDATION_FAILED","exception":{"stacktrace":["GraphQLError: Unknown argument "limit" on field "Query.posts"."," at Object.Argument (/path-to-project/backend/node_modules/graphql/validation/rules/KnownArgumentNamesRule.js:46:29)"," at Object.enter (/path-to-project/backend/node_modules/graphql/language/visitor.js:323:29)"," at Object.enter (/path-to-project/backend/node_modules/graphql/utilities/TypeInfo.js:370:25)"," at visit (/path-to-project/backend/node_modules/graphql/language/visitor.js:243:26)"," at validate (/path-to-project/backend/node_modules/graphql/validation/validate.js:69:24)"," at validate (/path-to-project/backend/node_modules/apollo-server-koa/node_modules/apollo-server-core/dist/requestPipeline.js:186:39)"," at processGraphQLRequest (/path-to-project/backend/node_modules/apollo-server-koa/node_modules/apollo-server-core/dist/requestPipeline.js:98:34)"," at processTicksAndRejections (node:internal/process/task_queues:96:5)"," at async processHTTPRequest (/path-to-project/backend/node_modules/apollo-server-koa/node_modules/apollo-server-core/dist/runHttpQuery.js:220:30)"," at async /path-to-project/backend/node_modules/apollo-server-koa/dist/ApolloServer.js:83:59"]}}}],"response":{}},"operation":{"key":2405370831,"query":{"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"limit"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"Int"}}},"directives":[]}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"posts"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"limit"},"value":{"kind":"Variable","name":{"kind":"Name","value":"limit"}}},{"kind":"Argument","name":{"kind":"Name","value":"sort"},"value":{"kind":"StringValue","value":"publishedAt:DESC","block":false}}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"data"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"attributes"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"publishedAt"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"title"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}}]}}],"loc":{"start":0,"end":115,"source":{"body":"query ($limit: Int!) { posts(limit: $limit sort:"publishedAt:DESC") { data { attributes { publishedAt title } } } }","name":"gql","locationOffset":{"line":1,"column":1}}}},"variables":{"limit":3},"kind":"query","context":{"url":"http://localhost:1337/graphql","preferGetMethod":false,"requestPolicy":"cache-first","suspense":false,"meta":{"cacheOutcome":"miss"}}},"hasNext":false}
GraphQL似乎可以识别变量$limit，但我不清楚应该如何使用它。我正在筛选文档，似乎找不到相关的示例。
对于其他在这方面遇到的问题，我最终通过Strapi GraphQL API 使用了分页
可能只是我在阅读文档方面做得不好：(但我会把解决方案留在这里以防万一。
解决方案
const GET_RECENT_POSTS_QUERY = `
query ($limit: Int!) {
posts (pagination: {start: 0, limit: $limit}, sort: "publishedAt:DESC") {
data {
attributes {
publishedAt
title
}
}
}
}
`
export default function Example() {
const [res] = useQuery({
query: GET_RECENT_POSTS_QUERY,
variables: { limit: 3 },
})
// ...