是否可以创建一个GraphQL子查询来创建一个数组作为markdownRemark的元素?
我正在为一所语言学校制作一个网页,现在正试图创建一个关于在那里教授的语言的网页。它们应该包括语言名称、简短描述和与之相关的日程项目列表。在Netlify CMS中,我为他们制作了两个系列。其中一个包含通用语言信息,另一个包含日程项目 当我输入一种语言的网页时,我想做的是从是否可以创建一个GraphQL子查询来创建一个数组作为markdownRemark的元素?,graphql,gatsby,Graphql,Gatsby,我正在为一所语言学校制作一个网页,现在正试图创建一个关于在那里教授的语言的网页。它们应该包括语言名称、简短描述和与之相关的日程项目列表。在Netlify CMS中,我为他们制作了两个系列。其中一个包含通用语言信息,另一个包含日程项目 当我输入一种语言的网页时,我想做的是从language\u页面集合中获取一般信息,并在language字段中获取一系列具有相同值的schedule\u项目,但我有点挠头想弄明白如何做 这两个集合中的每一个都包含一个templateKey字段,用于区分集合。一般语言信
language\u页面
集合中获取一般信息,并在language
字段中获取一系列具有相同值的schedule\u项目
,但我有点挠头想弄明白如何做
这两个集合中的每一个都包含一个templateKey
字段,用于区分集合。一般语言信息的值为language post
,日程项目的值为schedule item
获取单一语言页面的基本查询如下所示:
query {
markdownRemark(frontmatter: { language: { eq: "Niemiecki" }}) {
html
frontmatter {
language
description
}
}
}
字段语言也存在于schedule item集合中,因此我认为应该以某种方式使用它来过滤集合。然而,我是一个完整的GraphQLNoob,我还没有真正找到我正在尝试做的事情的例子。我的全部博奇工作产生了如下结果:
query {
markdownRemark(frontmatter: { language: { eq: "Niemiecki" }}) {
html
frontmatter {
language
description
}
children {
id
group
room
time
}
}
}
它甚至不能正常执行,老实说,我不知道如何才能使它工作。您可以使用regex并排执行两个查询并按文件夹名称进行筛选:
query LanguageInfo($lang: String) {
languagePage: markdownRemark(
frontmatter: { language: { eq: $lang }},
fileAbsolutePath: {
regex: "/your-language-folder-name/"
}
) {
frontmatter { ... }
}
scheduledItem: markdownRemark(
frontmatter: { language: { eq: $lang }},
fileAbsolutePath: {
regex: "/your-schedule-folder-name/"
}
) {
frontmatter { ... }
}
}
可以是以编程方式创建页面时传递给lang
操作的变量。然后可以在页面模板的查询中使用它。例如,如果您需要它:createPage
&languagePage
是一个别名,可以更轻松地检索数据。您可以访问数据,如scheduledItem
&data.languagePage…
data.scheduledItem…
如果有帮助,请告诉我。因此,每个集合有两个文件夹,它们都是markdown&每个文件夹都有
语言作为frontmatter
中的一个字段?*每个集合都有一个文件夹每个集合都有一个文件夹,包括markown页面,并且在frontmatter中有一个语言字段,正确。我认为此查询符合我的要求,只需调整我的其余代码以适应它:)非常感谢。我现在可以确认它是否按预期工作。再次非常感谢。我有一个公开的github回购协议,看看你是如何解决的?没有,对不起,当我遇到这个问题时,我正在做一个商业项目。该代码位于私人回购协议中。如果你还有其他问题,我很乐意帮忙
createPage({
path: `/my-sweet-new-page/`,
component: path.resolve(`./src/templates/my-sweet-new-page.js`),
// The context is passed as props to the component as well
// as into the component's GraphQL query.
context: {
lang: `english`,
},
})