假设我们在Gatsby中有2个不同的页面,其定义如下。
// one.md
---
foo:
bar: Bar
baz: Baz
---
Page One
// two.md
---
qux:
foo:
bar: Bar
baz: Baz
---
Page Two
然后我们可以像这样从每个文件的组件中查询数据。
// one.js
export const query = graphql`
query One($id: String!) {
markdownRemark(id: { eq: $id }) {
frontmatter {
foo {
bar
baz
}
}
}
}
`;
// two.js
export const query = graphql`
query Two($id: String!) {
markdownRemark(id: { eq: $id }) {
frontmatter {
qux {
foo {
bar
baz
}
}
}
}
}
`;
我的问题是如何创建一个片段,该片段可以为我获取foo
,并且可以在两个查询中重复使用?以下方法无效。
export const fooFragment = graphql`
fragment Foo on MarkdownRemarkFrontmatter {
foo {
bar
baz
}
}
`;
它不适用于two.js
,因为我们正在MarkdownRemarkFrontmatter
而不是MarkdownRemarkFrontmatterQux
上运行。有什么方法可以简化这些查询吗?