Graphql 如何查询棱镜切片并从每个切片返回数据

我正在尝试使用Gatsby的/__;graphq调试器和的自述文件，该文件表示可以返回切片。下面我将返回名为PrismicProductBodySteps的切片

{
  allPrismicHomePage {
        edges {
          node {
        data {
          seo_title
          body {
            __typename
            ... on PrismicProductBodySteps {
              }
            }
          }
        }
       }
    }
  }
}

谁能给我解释一下。。。在棱镜上，台阶意味着什么

在盖茨比组件中，我将此作为示例

body {
  ... on PrismicProductsBodySteps {
    ...ProductStepsFragment
}

有人能给我解释一下…ProductStepsFragment是什么意思吗

PrismicProductBodySteps将是一个自定义节点类型名称，表示一系列动态内容块。该自定义节点类型名称来自Prismic数据模型；你的可能会有所不同

根据文档，使用自定义节点类型名称需要首先确定它们是什么：

获取节点类型的最简单方法是使用/\uuuuuuuu图形ql 调试器并运行以下查询调整文档类型和字段 名字

一旦有了自定义节点类型名称，就可以使用GraphQL片段来提取每个片段特定的数据。同样，这取决于您在数据模型中如何定义片段，但它看起来是这样的：

{
  allPrismicHomePage {
    edges {
      node {
        data {
          seo_title
          body {
            __typename
            ... on PrismicYourContentBlockOne {
              text {
                html
              }
            }
            ... on PrismicYourContentBlockTwo {
              text {
                html
              }
            }
            ... on PrismicYourContentBlockThree {
              text {
                html
              }
            }
          }
        }
      }
    }
  }
}

---

谢谢@staypuftman所以我是你的例子f Eat片段是PrismicYourContentBlockOne？同样在我的例子中，PrismicProductsBodySteps{…ProductStepsFragment}上的body{…是什么.Mean.我假设PrismicProductsBySteps是片段，但如果是这样，那么什么是…productStepsFragment.productStepsFragments是由自定义节点类型PrismicProductsBySteps创建的对象这两个都是您的数据模型自定义的…productStepsFragment使用ES6扩展语法，基本上调用同时构造对象。另一种思考方法-将您的后端数据模型想象为一个管理接口。它可能有一个部分，它将是PrismicProductsBodySteps。在您的管理中，您可以制作任意数量的对象-每一个都创建自己的数据集，由productStepsFragmentWell表示，这两个productStepsFragment graphQL fragment和PrismicProductsBySteps自定义节点类型名称来自您在Prismic上设置的数据模型。它们遵循一种模式，但您得到了一个概念：您为数据模型指定的任何名称都将流向您的组件。

{
  allPrismicHomePage {
    edges {
      node {
        data {
          seo_title
          body {
            __typename
            ... on PrismicYourContentBlockOne {
              text {
                html
              }
            }
            ... on PrismicYourContentBlockTwo {
              text {
                html
              }
            }
            ... on PrismicYourContentBlockThree {
              text {
                html
              }
            }
          }
        }
      }
    }
  }
}