在 Gatsby 中允许可选的 GraphQL 数据

Question

我正在尝试在我的 gatsby-node.js 文件中构建一个支持可选值的类型。我认为这是用 [String!]!.

完成的

如何在 home.js 上加载我在 gatsby-node.js 中创建的新类型？

盖茨比-node.js:

const path = require('path');
exports.createSchemaCustomization = ({ actions }) => {
    const { createTypes } = actions;
    const typeDefs = `
        type markdownRemark implements Node {
            frontmatter: Features
        }
        type Features {
            title: [String!]!
            description: [String!]!
        }
    `;
    createTypes(typeDefs);
};

pages/home/home.js:

export const query = graphql`
    query HomeQuery($path: String!) {
        markdownRemark(frontmatter: { path: { eq: $path } }) {
            html
            frontmatter {
                features {
                    title
                    description
                }
            }
        }
    }
`;

home.md:

---
path: "/"
features:
    - title: Barns
      description: Praesent commodo cursus magna vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
    - title: Private Events
      description: Praesent commodo cursus magna vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
    - title: Food and Drinks
      description: Praesent commodo cursus magna vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
    - title: Spa
      description: Praesent commodo cursus magna vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
---

这需要工作，以便如果 home.md 前面的 features 数组为空，GraphQL 不会抛出错误。

请不要让我总是在数组中包含至少一个值，因为这不切实际，我的解决方案需要在我的数组中不支持任何值。

我花了两个小时 documentation/issues 转了一圈，试图找到可行的解决方案，请有人救救我吧！

Answer 1

来自GraphQL docs：

String! means that the field is non-nullable, meaning that the GraphQL service promises to always give you a value when you query this field. In the type language, we'll represent those with an exclamation mark.

[Episode!]! represents an array of Episode objects. Since it is also non-nullable, you can always expect an array (with zero or more items) when you query the field. And since Episode! is also non-nullable, you can always expect every item of the array to be an Episode object.

GraphQL中的感叹号!表示non-nullable，所以[String!]!表示存在非空字符串的非空数组.

如果您希望某个字段是可选的，请将其保留原样，不要使用感叹号 !。例如 [String] 表示数组可以为空，或者其中的任何字符串值都可以为空。

我也不确定您是否首先要使用数组，因为特征的 title 和 description 肯定应该只是一个字符串？

根据 Gatsby docs，我认为您正在寻找的是：

const typeDefs = `
    type markdownRemark implements Node {
        // Use custom frontmatter type
        frontmatter: Frontmatter
    }
    // Define custom frontmatter type
    type FrontMatter {
      // Nullable array of Feature elements
      features: [Feature]
    }
    // Feature has nullable fields title and description
    type Feature {
        title: String
        description: String
    }
`;

这意味着 frontmatter 有一个名为 features 的字段，它可以为 null（可选），如果它确实存在，它是一个 Feature 对象的数组。它可以为空，但如果存在任何 Feature 个对象，则每个 Feature 都有一个可为空（可选）的 title 和 description 字段。

在 Gatsby 中允许可选的 GraphQL 数据

Allow optional GraphQL data in Gatsby

reactjs

yaml-front-matter

graphql

gatsby