Query 与字段选择

Query 是 GraphQL 的读操作：客户端声明需要的字段树，服务端只返回这些字段——解决 REST 常见的 过度获取 与 多次往返。

学习目标

• 编写嵌套 Query、别名、变量
• 理解字段选择与 Resolver 的对应关系
• 对比本站 REST /tracks 响应与等价 Query

核心内容

按需取字段

query TrackList {
  tracks {
    slug
    title
  }
}

列表页只需 slug、title；详情页再查 description、lessons { slug title }。REST 等价：GET /tracks 返回完整 DTO，字段裁剪靠 DTO 版本或 ?fields= 扩展——本站未采用后者。

嵌套与参数

query TrackDetail($slug: String!) {
  track(slug: $slug) {
    title
    level
    lessons {
      slug
      title
      duration
    }
  }
}

变量 $slug 在 HTTP POST body 的 variables 里传入；对应 REST：

GET /tracks/graphql-essentials
GET /tracks/graphql-essentials/lessons/gql-intro   # 若 lessons 未内嵌

别名、片段与前端

别名可一次请求多组数据；Fragment 复用 Lesson { slug title duration } 字段集。nextjs-essentials 课时页从 REST 取 contentMd 再 MDX 渲染——列表 Query 不宜默认带大字段。react-essentials 三态模式不变；Apollo 替换 fetch('/tracks/...') 但 CodeRoadMap 主路径仍 REST。

练习

• 写 Query：只取 graphql-essentials 前 3 个 lesson 的 slug 与 title
• 用 Fragment 定义 TrackCard，在两条别名 query 中复用
• 说明：为何列表页不宜在 REST 或 GraphQL 中默认返回 contentMd

小结

Query = 声明式读；字段即文档。 下一课 Mutation 写操作与输入类型。