CraftCMS Gatsby 项目抛出错误“GraphQL 错误预期类型 [String]，找到 {eq: $slug}。”答案

【问题标题】：CraftCMS Gatsby project throwing error "GraphQL Error Expected type [String], found {eq: $slug}."CraftCMS Gatsby 项目抛出错误“GraphQL 错误预期类型 [String]，找到 {eq: $slug}。”
【发布时间】：2020-02-14 12:43:59
【问题描述】：

我刚开始与 Gatsby 合作，看看以 Craft 作为后端、Gatsby 作为前端来重建我公司的 CraftCMS 网站是否是一个不错的选择。到目前为止，一切都运行良好，直到需要查询我们“活动”频道中的各个条目。

作为记录，我已经能够使用 .map() 为“整体视图”页面上的每个广告系列条目呈现完整列表，以查看所有广告系列。我还能够递归地构建每个活动页面，以便它调用我的 /src/templates/campaign-page.js 模板并从我网站的 Craft API 中毫无问题地提取正确的 slug。出于某种原因，我无法在campaign-page.js 模板中查询我的个人广告系列数据。

我几乎阅读了 Gatsby 文档中的每一页以及当前存在的每个教程，但对于我的一生，我无法弄清楚为什么我的 GraphQL 查询不会过滤我的个人广告系列条目。它只是一直告诉我，“GraphQL 错误预期类型 [String]，找到 {eq: $slug}。”

我还尝试根据一些降价文档将“slug: {eq: $slug}”包装在“过滤器：”中，但这只是告诉我“过滤器”不存在。我开始认为问题出在我的 gatsby-node.js 文件中，但是当我将它与文档进行比较时，我没有看到任何问题。

盖茨比-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
                    }
                }
            }
        }
    `

作为参考，这是我的主要活动.js 页面上的典型工作查询，其中列出了所有可用的活动：

           query = {graphql`
                {
                    api {
                        entries(section: "campaigns") {
                            ... on API_campaigns_campaigns_Entry {
                                id
                                campaignTitle
                                uri
                                slug

                            }
                        }
                    }
                }
            `}

我希望我的 /src/templates/campaign-page.js 模板能够呈现各个广告系列数据。

【问题讨论】：

标签： javascript reactjs graphql gatsby craftcms

【解决方案1】：

我终于让我的一位同事查看了我的代码。我所要做的就是将我的 $slug 变量放在括号中：

entries (section: "campaigns", slug: [$slug] )

那两天我希望我能回来。

【讨论】：