时间戳

首页 > 解决方案 > 如果未使用，带有 wordpress 的 Gatsby 找不到 ACF 灵活内容字段

wordpress - 如果未使用，带有 wordpress 的 Gatsby 找不到 ACF 灵活内容字段

问题描述

我在 Wordpress 中有一个灵活的内容字段类型（使用 ACF），并且在尝试构建 gatsby 时出现错误。

我使用以下插件：

对于 gatsby，我使用 gatsby-source-wordpress。

{
  allWordpressPage {
    edges {
      node {
        title
        acf {
          page_builder_page {
            ... on WordPressAcf_hero {
              title
              subtitle
            }
            ... on WordpressAcf_text {
              text
            }
          }
        }
      }
    }
  }
}

仅当某些页面的页面类型上的 block page_builder使用hero和text块时，上述查询才有效。如果我是第一次设置此页面，或者创建具有相同 page_builder 字段的新自定义帖子类型，我需要为每个灵活的内容块类型填充至少一个字段，然后 graphql-query 才能工作。

否则，对于每个未使用的块，我都会收到与此类似的错误（例如，如果 hero-type 有内容但没有 text-type）：

GraphQL request: Fragment "TextBlockFragment" cannot be spread here as objects of
type "WordPressAcf_hero" can never be of type "WordPressAcf_text".

有针对这个的解决方法吗？我想它不应该是这样的。就像现在一样，我需要在第一次设置页面时用虚拟内容填充整个页面，然后才能使用 Gatsby 实际构建它。

标签： wordpressgraphqlgatsby

解决方案

我认为您遇到的问题类似于我在使用 Gatsby + WordPress REST API 时也遇到的一个相当常见的问题。

一个简短的总结是，例如，当有一个没有图像的 ACF 库字段时，WordPress REST API 将返回一个布尔值，而不是nullGraphQL 查询在该字段为空时所期望的。我怀疑同样的事情正在发生在您身上：您正在查询尚未填写的子字段，并且您收到 GraphQL 解释为错误类型的响应，而不是null. （完全披露，我对 GraphQL 的唯一经验是通过 Gatsby。）

幸运的是，我认为您有很多选择可以解决这个问题。

新盖茨比解决方案

Gatsby 团队和贡献者最近一直在非常积极地开展这项工作，您目前可以在此处试用新方法的预览版：https ://www.gatsbyjs.org/blog/2019-03-04-new-模式定制/

如果需要，您可以在此处阅读有关问题和背景的更多信息：https ://github.com/gatsbyjs/gatsby/issues/3344

现有的快速 WordPress 解决方案

如果您不想使用尚未完全合并到 Gatsby 中的东西，现在可以使用两种解决方案：

  1. null为该 ACF 字段设置空响应，如 Gatsby 团队中的 @pieh 所述，该 GitHub 问题中有更多示例用于其他字段类型
  2. 创建“虚拟”内容，填写所有内容，然后在显示之前过滤掉该帖子（例如，当 slug 为 时placeholder）。这里的问题是，对于每个自定义帖子类型，您都有这些无法从 WordPress 中删除的虚假帖子。

我已经使用了这两种方法，并且都有效。我想说#2 可能更可靠，因为它同时适用于您正在使用的所有字段，但可能更令人困惑，具体取决于谁在使用 CMS：“为什么这些帖子在这里？”</p>

希望这会有所帮助！

推荐阅读