2

更新

深入挖掘 Gatsby 文档，我发现了一些潜在的解决方案：

仍在修改我在 Kontent 中的内容类型并找出 GraphQL 位。

==============

原来的：

我正在从更传统的开箱即用 CMS 解决方案过渡到使用 JAMStack 和无头 CMS。

在与 Gatsby 和 Kontent 一起尝试构建迁移的概念证明时，我陷入了如何生成导航和面包屑的问题上，而传统的 CMS 内容层次结构我认为这是理所当然的。

我已经阅读了一些文章并逐渐了解使用内容类型构建导航的概念。

它是如何从原本扁平的内容层次结构中组合起来并生成链接的？

例如 www.example.com/some/deep/linked/page

谢谢

4

1 回答 1

2

我刚刚从传统的 CMS 框架迁移到 Kontent，所以我知道您的感受！我想你已经阅读了关于导航的 Kontent 教程？选项 C 为您提供传统的分层 CMS 内容树，其中包含导航项内容类型上的链接项。这使得菜单很容易构建。

在 Gatsby 中，我个人只是使​​用 URL slugs 作为要创建的页面的路径。这是在您的 gatsby-node.js 文件中完成的，您可以在其中使用 GraphQL 查询内容，然后创建如下节点：

_.each(result.data.allArticles.nodes, node => {
  createPage({
    path: `/articles/${node.elements.article_url_slug.value}/`,
    component: slash(articleTemplate),
    context: { slug: `${node.elements.article_url_slug.value}` },
  })
})

只要您的内容编辑器维护这些 slug，这将起作用。如果您想根据菜单结构自动生成路径，您可以通过为内容项添加链接项来扩展导航项内容类型，也许可以代替 URL 字段。然后，在创建节点时，您可以遍历导航树并根据项目标题构建路径，查找内容项目的类型，以便您可以使用适当的组件并将所需的上下文传递给它。

然后，您可以在面包屑组件中使用相同的层次结构 - 您只需要在导航项中搜索当前项，然后返回树。说得通？

虽然一开始必须构建所有这些基础设施可能会令人沮丧，但我喜欢完全的自由和为项目的特定需求选择正确方法的能力。

于 2020-06-05T16:04:19.223 回答