reactjs - Graphql:如果参数类型为字符串，则跳过该参数

Question

我有一个针对 Markdown 文件的 graphql 查询，它从 Markdown 的 frontmatter 请求 title、author 和 coverImg。

有些Markdown文件没有封面图，没有图片的时候，coverImg的类型好像是String

我正在使用 gatsby-image，它使用 sharp 并且我想进入 coverImg 参数的子级，如果 coverImg 是一个对象而不是字符串

---

这是我的查询

query($path: String!) {
    markdownRemark(fields: { slug: { eq: $path } }) {
        frontmatter {
            title
            author
            coverImg {
              childImageSharp {
                fluid(maxWidth: 600) {
                  src
                  srcSet
                  sizes
                  aspectRatio
                }
              }
           }
        }
     }
 }

如果我尝试这样做，我会收到错误

There was an error in your GraphQL query:

Field "cover" must not have a selection since type "String" has no subfields.

This can happen if you e.g. accidentally added { } to the field "cover". If you didn't expect "cover" to be of type "String" make sure that your input source and/or plugin is correct.

---

看起来有 graphql if statements但我不知道如何使用这些有条件地分支到 child 。如果我可以添加类似

的内容，那就太好了

 coverImg @skip(if: coverImg is String) {

Answer 1

AFAIK Gatsby 不会在每个文件的基础上推断您的数据模式，所以一旦它推断出一个字段为 String , 该字段将始终为 String 类型.

您可以使用模式自定义 Hook 来告诉 Gatsby 字段 coverImg是一个文件(正如@ksav 在评论中所建议的那样):

exports.createSchemaCustomization = ({ actions }) => {
  actions.createTypes(`
    type MarkdownRemarkFrontmatter @infer {
      coverImg: File
    }

    type MarkdownRemark implements Node @infer {
      frontmatter: MarkdownRemarkFrontmatter
    }
  `)
}

然后你可以检查是否coverImg存在。

if (!coverImg) {
  // no image
} else if (coverImg.childImageSharp) {
  // has image
} else {
  // file is not an image
}