我刚刚开始与Gatsby一起工作,以查看用Craft作为后端并以Gatsby作为前端来重建我公司的CraftCMS网站是否是一个不错的选择。到目前为止,一切都运行良好,直到需要查询“广告系列”频道中的各个条目。
作为记录,我已经能够使用.map()为“总体视图”页面上的每个广告系列条目提供完整列表,以查看所有广告系列。我还能够递归地构建每个广告系列页面,以便它调用我的/src/templates/campaign-page.js模板,并且从我网站的Craft API中正确提取了信息。由于某些原因,我只是无法在Campaign-page.js模板中查询个人的广告系列数据。
我已经阅读了盖茨比(Gatsby)文档中的几乎每个页面以及当前存在的每个教程,但是对于我来说,我不知道为什么我的GraphQL查询不会为我的单个广告系列条目过滤。它只是一直告诉我,“ GraphQL错误预期类型为[String],找到的是{eq:$ slug}。”
我还尝试根据一些降价文档将“子弹:{eq:$ slug}”包装在“过滤器:”中,但这只是告诉我“过滤器”不存在,我开始认为问题在我的gatsby-node.js文件中,但是将其与文档进行比较时没有看到任何问题。
Gatsby-node.js
const path = require(`path`)
exports.createPages = async ({ actions, graphql }) => {
const { data } = await graphql(`
query {
api {
entries(section: "campaigns") {
slug
}
}
}
`)
data.api.entries.forEach(({ slug }) => {
actions.createPage({
path: "/campaigns/" + slug,
component: path.resolve(`./src/templates/campaign-page.js`),
context: {
slug: slug,
},
})
})
}
Campaign-page.js
export default ({data}) => {
const post = data.api.entries
return(
<div className={"campaign-page-single"} style={{marginTop: '-21px,'}}>
<Header/>
<div>
<h1>{post.id}</h1>
</div>
</div>
)
}
export const campaignQuery = graphql`
query ($slug: String!){
api{
entries (slug: { eq: $slug }){
slug
id
... on API_campaigns_campaigns_Entry {
id
campaignTitle
slug
}
}
}
}
`
作为参考,这是我的campaigns.js主页面上列出所有可用广告系列的典型工作查询的样子:
query = {graphql`
{
api {
entries(section: "campaigns") {
... on API_campaigns_campaigns_Entry {
id
campaignTitle
uri
slug
}
}
}
}
`}
我希望我的/src/templates/campaign-page.js模板能够呈现各个广告系列数据。
答案 0 :(得分:1)
我终于让我的一位同事来看看我的代码。我所要做的就是将$ slug变量包装在方括号中,如下所示:
entries (section: "campaigns", slug: [$slug] )
那是我希望可以回来的两天。