Javascript 使用GraphQL从Gatsby.js中的WP获取ACF灵活内容

Javascript 使用GraphQL从Gatsby.js中的WP获取ACF灵活内容,javascript,wordpress,reactjs,graphql,gatsby,Javascript,Wordpress,Reactjs,Graphql,Gatsby,我正在使用Gatsby.js和Wordpress插件来查询Wordpress REST-API。我在解决如何使用一个查询的结果创建另一个动态查询时遇到了问题,该查询可以有效地循环返回的数组 由于我在wordpress中使用ACF Flexible Content,所以在进行第一次查询之前,我无法知道数据的结构。第一个查询返回已添加到CMS中的灵活布局的_类型名数组,然后我执行第二个查询,返回上述每个布局的ID 这就是我遇到困难的地方——我如何循环通过IDs数组并使用现在已知的_类型名进行查询以获

我正在使用Gatsby.js和Wordpress插件来查询Wordpress REST-API。我在解决如何使用一个查询的结果创建另一个动态查询时遇到了问题,该查询可以有效地循环返回的数组

由于我在wordpress中使用ACF Flexible Content,所以在进行第一次查询之前,我无法知道数据的结构。第一个查询返回已添加到CMS中的灵活布局的_类型名数组,然后我执行第二个查询,返回上述每个布局的ID

这就是我遇到困难的地方——我如何循环通过IDs数组并使用现在已知的_类型名进行查询以获取ACF Flexible content中列出的所有字段

 {
   wordpressPage(title : {eq:"About"}) {
     acf {
       components_page {
         __typename  
         // This returns an array of types 
         // eg [ 
         //     __typename : WordPressAcf_image_and_copy,
         //     __typename : WordPressAcf_body_copy
         //    ]
       }
     }
     children {
       id 
       // This returns an array of IDs 
       // eg [ 
       //     id : 4d2dac46-889e-593b-a00b-4a5ccaa87dfa2componentsWordPressAcf_image_and_copy, 
       //     id : 4d2dac46-889e-593b-a00b-4a5ccaa87dfa1componentsWordPressAcf_body_copy
       //    ]
     }
   }

   /* 
   ** This is the kind of query that I need to generate dynamically
   ** using the type returned above along with the ID returned above :
   */
   wordPressAcfImageAndCopy(id : {eq: "4d2dac46-889e-593b-a00b-4a5ccaa87dfa3componentsWordPressAcf_image_and_copy"}) {
     title
     subtitle
     body_copy
   }
 }
如果我没有很清楚地解释这一点,我深表歉意-我感谢任何人能给我的建议。

上发布的解决方案是:


对于任何一个在将来出现在这篇文章上希望解决类似问题的人,我的问题在这里得到了非常友好的回答:由
query homeQuery {
  wordpressPage(title: {eq: "About"}) {
    children {
      __typename
      ... on WordPressAcf_hero {
        title
        subtitle
      }
    }
  }
}