从降价文件映射列表的 graphql 输出

Question

我正在使用 Gatsby.js 并使用 GraphQL 从降价文件中检索数据。降价文件的内容结构为：

---
title: abc
---

- heading A
 - sub-heading A
 - sub-heading B
- heading B
 - sub-heading A
 - sub-heading B
 - sub-heading C
...

使用插件 gatsby-transformer-remark，我得到的 graphql 输出是这样的：

{
  "data": {
    "allMarkdownRemark": {
      "edges": [
        {
          "node": {
            "internal": {
              "content": "\n- heading A\n  - sub-heading An  - sub-heading B\n- heading B ....

是否有可能获得降价列表的数组甚至对象，以便我可以映射（循环）我的 javascript 代码中的值？

谢谢

Answer 1

您要构建 table 内容吗？ Gatsby的备注插件自动generate a table of content for you，还有一些选项可以传入修改。

从文档中复制：

{
  allMarkdownRemark {
    edges {
      node {
        html
        tableOfContents(
          pathToSlugField: "frontmatter.path"
          heading: "only show toc from this heading onwards"
          maxDepth: 2
        )
        frontmatter {
          # Assumes you're using path in your frontmatter.
          path
        }
      }
    }
  }
}

如果您要自定义 table 内容，在 frontmatter 中进行会更容易。如果那不可能，我知道的最后一个选择是编写一个自定义解析数据的备注插件，然后将其附加到 graphql 节点

从降价文件映射列表的 graphql 输出

Map over graphql output of list from a markdown file

markdown

graphql

gatsby

remarkjs