Gatsby WordPress Source - 不使用时被 graphql 忽略的灵活内容布局

Posted 2023-03-08

【中文标题】Gatsby WordPress Source - 不使用时被 graphql 忽略的灵活内容布局

【英文标题】：Gatsby WordPress Source - Flexible Content layouts ignored by graphql when not used

【发布时间】：2019-07-21 22:21:32

【问题描述】：

总结

我使用 ACF 中的灵活内容功能在 WordPress 中设置了大约 15 种不同的布局。因为有这么多，这意味着内容作者没有使用一些。当 gatsby 拉入内容并生成 graphql 数据结构时，它会根据已经使用的布局创建结构。当我设置查询以提取所有布局时，我收到一个错误，因为查询了一些在 graphql 结构中不存在的布局（因为它们没有被作者使用）。这是一个查询示例。

acf 
    content_layouts_page 
        __typename
        ... on WordPressAcf_pullout_lead_with_list 
             ...plwlFragment
        
        ... on WordPressAcf_client_list 
            ...clFragment
        
        ... on WordPressAcf_titled_list_with_item_description 
             ...tlwidFragment
        
        ...more layouts defined
    

问题

我如何设置我的 graphql 查询，以便在作者决定使用未使用的布局时“面向未来”。

可能的解决方案

这是我想到的解决方案，但我不确定是否可行。如果我可以查询__typename，它将返回一个数组。然后根据当前布局动态构造graphql查询。

// __typename array = ['WordPressAcf_pullout_lead_with_list', 'on WordPressAcf_client_list']
let queryString = ''
__typename.forEach(layout => 
    switch (layout) 
        case 'WordPressAcf_pullout_lead_with_list':
            queryString += '...on WordPressAcf_pullout_lead_with_list  ...plwlFragment '
            break;
        ....
    
)

// Use queryString in graphql query

同样，不确定这是否可能，但它肯定会解决很多问题。

Github 问题

Gatsby Github repo 上也有人问过这个问题，并给出了指导。阅读更多here

【参考方案1】：

自 2019 年 3 月 1 日起，无法动态创建 graphql 查询。这个问题的解决方案是有一个包含所有内容布局的“虚拟”页面，并在你的 graphql 查询中忽略它。尽管您忽略了它，但您的 graphql 架构将包含所有布局结构。

allWordpress(Page|Post)(filter:slug:ne:"dummy-page") 
    edges 
        node 
            ...