使用Conteful API在Gatsby中按标签对内容进行排序 [英] sort content by tag in Gatsby with Conteful API

问题描述

在Contful中，我创建的内容几乎没有媒体图片。图片有两个不同的标签boxon和attaqueGenetique。我想使用我为每个媒体添加的标签对幻灯片进行排序，但我找不到这样做的方法。盖茨比网站上有一个例子，但不是很清楚，我试了试也没能把它变成我的。

Gatsby

中的示例

query FilterByTagsQuery {
  allContentfulNumber(
    sort: { fields: contentful_id }
    filter: {
      metadata: {
        tags: { elemMatch: { contentful_id: { eq: "numberInteger" } } }
      }
    }
  ) {
    nodes {
      title
      integer
    }
  }
}

我想我必须将这段代码转置到我的 allContentfulNumber成为allContentfulDiaporama和

metadata: {
        tags: { elemMatch: { contentful_id: { eq: "numberInteger" } } }
      }

成为

metadata: {
        tags: { elemMatch: { contentful_id: { eq: "boxon" } } }
      }

但是当我尝试编译控制台时，返回 56:5 error Field "metadata" is not defined by type "ContentfulDiaporamaFilterInput" graphql/template-strings

我不知道在内容中导入元数据时，从哪里捕捉到媒体的元数据...但我对graphql和Contentful非常陌生。如果有解决办法，那就是让我的日子过得开心！

Gatsby

metadata在Gatsby的示例中是一个在其数据结构中有效的推荐答案节点，如果您的节点不是有效的自定义类型，则干脆不使用它，否则它将破坏代码。

除了使用无效字段(metadata)之外，查询中的问题还在于您使用了elemMatch过滤器，将contentful_id(数字)与boxon(字符串)进行比较，因此它永远不会在您的场景中工作(它在Gatsbys中工作，因为它是同一类型的)。在您的例子中，您可能希望使用in(用于数组)或eq(用于单个值)。查看可用的列表：https://www.gatsbyjs.com/docs/graphql-reference/#filter

根据我对您的问题的理解，您似乎希望将diaporama数据拆分到两个不同的节点中，一个包含boxon，另一个包含attaqueGenetique。如果是这样，您将需要通过别名来创建不同的节点：

query FilterByTagsQuery {
  boxon: allContentfulDiaporama(
    sort: { fields: contentful_id }
    filter: {
        metadata: { tags: { in: ["boxon"]  } }
      }
  ) {
    nodes {
      #your data/fields here
    }
  }
  attaqueGenetique: allContentfulDiaporama(
    sort: { fields: contentful_id }
    filter: {
        metadata: { tags: { in: ["attaqueGenetique"]  } }
      }
  ) {
    nodes {
      #your data/fields here
    }
  }
}

在localhost:8000/___graphql提供的GraphiQL操场中测试查询，在那里您可以更直观地添加或删除筛选器并查看可用的节点。

上面的代码片断将基于别名标记生成两种不同的数据结构。boxon: allContentfulDiaporama是boxon中allContentfulDiaporama结果的别名，因此在您的页面中，您将能够分别直接访问props.data.boxon和props.data.attaqueGenetique。

请记住，sort筛选方法仅适用于日期或数值，对于字符串，它将按字母顺序对它们进行排序。因此，我假设您的数据具有contentful_id(我不确定按contentful_id进行排序将有何帮助)。

根据此pull-requestenableTags功能已在最新版本中修复(5天前)，因此请尝试升级您的插件依赖项。

似乎是固定的，根据这个GitHub thread：

gatsby-source-contentful@7.5.0-next.0

或在下一个版本中。

这篇关于使用Conteful API在Gatsby中按标签对内容进行排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！