javascript - "StringQueryOperatorInput"类型是什么？我怎样才能摆脱这个恼人的 graphql 错误？

Question

我正在尝试使用 Gatsby API createPages 和 Firebase 中的数据以编程方式创建 Gatsby 页面。我已经成功设置了所有内容，直到可以通过 GraphQL 访问 Firebase 数据，现在我想查询使用 id (字符串格式)创建的每个新页面的特定数据。但是，当我创建模板组件并尝试查询数据时，我收到此错误:

Variable "$clientId" of type "String!" used in position expecting type "StringQueryOperatorInput".

我到处寻找这个StringQueryOperatorInput的引用，但找不到任何关于它的信息。 Google 和 graphql 文档似乎没有提到这个术语，这是我第一次看到它。经过一个小时的故障排除后，我得到了一个不同的错误:

If you're e.g. filtering for specific nodes make sure that you choose the correct field (that has the same type "String!") or adjust the context variable to the type "StringQueryOperatorInput".
File: src/templates/Homeowner/Homeowner.js:24:9

但是，我仍然不知道 StringQueryOperatorInput 是什么或如何解决这个问题。下面是我的此组件的代码以及 gatsby-node.js 和 gatsby-config.js，其中我使用插件来获取 Firebase 数据。我真的可以在这方面使用一些帮助，我似乎找不到这个 StringQueryOperatorInput 的任何引用。其他一切都工作正常，我只是无法让 Homeowner.js 模板上的此查询正常工作。

gatsby-node.js

exports.createPages = async ({ graphql, actions }) => {
  const { createPage } = actions;
  const result = await graphql(`
    query {
      allClients {
        nodes {
          firstName
          lastName
          id
        }
      }
    }
  `);
  console.log(JSON.stringify(result, null, 4));
  result.data.allClients.nodes.forEach(node => {
    const slug = `/client/${node.id}`;
    createPage({
      path: slug,
      component: require.resolve(`./src/templates/Homeowner/Homeowner.js`),
      context: { clientId: node.id },
    });
  });
};

src/templates/Homeowner/Homeowner.js

import React from 'react';
import { graphql } from 'gatsby';
import { withFirebase } from '../../components/Firebase';
import { withStyles } from '@material-ui/core/styles';
import Layout from '../../components/layout';

const Homeowner = ({ data }) => {
  console.log(data.clients, 'data');
  return (
    <>
      <Layout>
        <h1>Home Owner Component</h1>
        {/* <h3>{client.firstName}</h3>
        <h3>{client.lastName}</h3>
        <h3>{client.email}</h3> */}
      </Layout>
    </>
  );
};

export default Homeowner;

export const query = graphql`
  query($clientId: String!) {
    clients(id: $clientId) {
      firstName
      lastName
      email
    }
  }
`;

gatsby-config.js

require('dotenv').config({
  path: `.env.${process.env.NODE_ENV}`,
});
module.exports = {
  siteMetadata: {
    title: `SiteTitle`,
    siteUrl: `https://www.mysitwe.com`,
    description: `YourSite`,
  },
  plugins: [
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-sitemap`,
    `gatsby-plugin-styled-components`,
    `gatsby-plugin-sharp`,
    `gatsby-transformer-sharp`,
    {
      resolve: `gatsby-source-firebase`,
      options: {
        credential: require('./firebase-key.json'),
        databaseURL: 'https://firebaseurl/',
        types: [
          {
            type: 'Clients',
            path: 'clients',
          },
          {
            type: 'Users',
            path: 'users',
          },
        ],
      },
    },
    {
      resolve: `gatsby-plugin-prefetch-google-fonts`,
      options: {
        fonts: [
          {
            family: `Nunito Sans`,
            variants: [`400`, `600`, `800`],
          },
          {
            family: `Montserrat`,
            variants: [`300`, `400`, `400i`, `500`, `600`],
          },
          {
            family: `Spectral`,
            variants: [`400`, `600`, `800`],
          },
          {
            family: `Karla`,
            variants: [`400`, `700`],
          },
        ],
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`,
      },
    },
    `gatsby-plugin-offline`,
  ],
};

如果有人可以帮助我，请提前致谢。

Answer 1

实际上，在我发布这个问题后，我就找到了解决方案。我需要像这样设置我的查询:

export const query = graphql`
  query($clientId: String!) {
    clients(id: { eq: $clientId }) {
      firstName
      lastName
      email
    }
  }
`;

我假设省略 {eq: $clientId} 会在 GraphQL 端引发 StringQuery 错误。我仍然不知道 StringQueryOperatorInput 是什么，但是，我已经成功使用 firebase 中的数据生成了页面。