4. 解析器和数据源
5m

🎯  你的目标是构建一个单个查询来访问模块页面，并使用 Explorer 确认它在返回实时数据。

为了实现此目标，你将要实现新的和更新。

我们数据的 REST API 位于此处https://odyssey-lift-off-rest-api.herokuapp.com/

数据源任务

数据源解决方案

在datasources/track-api.js中添加下面的方法到TrackAPI类中：

getModule(moduleId) {
  return this.get(`module/${moduleId}`);
}
解析器任务

解析器解决方案

在 resolvers.js 中，在 Query 对象内：

// get a single module by ID, for the module detail page
module: (_, { id }, { dataSources }) => {
  return dataSources.trackAPI.getModule(id);
};
Design mockup of the Module page
在 Studio 上进行测试

查询解决方案

此 应在 Studio 上运行：

query getModuleAndParentTrack($moduleId: ID!, $trackId: ID!) {
  module(id: $moduleId) {
    id
    title
    content
    videoUrl
  }
  track(id: $trackId) {
    id
    title
    modules {
      id
      title
      length
    }
  }
}

在 Variables 面板中测试这些值： 

{
  "trackId": "c_0",
  "moduleId": "l_0"
}
检查你的作业！
在 Studio 中运行查询后，我可以看到 ID 为 l_0 的模块标题为 
 
，其 videoUrl 的最后 2 个字符为 
 
。模块的父曲目 ID c_0 的标题为 
 
 ，并且它有 
 
 个模块。

将此框中的项目拖动到上面的空白位置

  • 10

  • 猫空学，简介

  • 猫咪太空服，你需要知道的一切

  • 探索时间与空间

  • 夜空

  • Ab

  • Xo

  • 8

  • 4

  • Ox

上一步