Next.js中urql+Strapi GraphQL传limit参数报错求助

错误原因 #

Strapi的GraphQL API设计中，posts根字段并不直接接收limit作为顶层参数，分页相关参数（包括limit、start等）需要嵌套在pagination对象中传递。

修正后的代码示例 #

带变量的查询语句 #

const GET_RECENT_POSTS_QUERY = `
query ($limit: Int!){
  posts (sort: "publishedAt:DESC", pagination: { limit: $limit }) {
    data {
      attributes {
        publishedAt
        title
      }
    }
  }
}
`

组件使用部分 #

import { useQuery } from 'urql'

export default function Example() {
  const [res] = useQuery({
    query: GET_RECENT_POSTS_QUERY,
    variables: { limit: 3 },
  })

  return (
    <div>
      <h3>Recent Posts</h3>
      <div>{JSON.stringify(res)}</div>
    </div>
  )
}

补充说明 #

如果需要同时设置起始偏移量（比如跳过前N条数据），可以在pagination中添加start参数：

query ($limit: Int!, $start: Int!){
  posts (
    sort: "publishedAt:DESC", 
    pagination: { limit: $limit, start: $start }
  ) {
    data {
      attributes {
        publishedAt
        title
      }
    }
    meta {
      pagination {
        total
        page
        pageSize
        pageCount
      }
    }
  }
}

同时在变量中传递start: 0（或其他数值），并且可以通过meta.pagination获取分页元数据，方便实现完整分页功能。

内容的提问来源于stack exchange，提问作者abgregs