React - 带有输入变量的 Apollo 客户端查询

Posted 2023-03-10

【中文标题】React - 带有输入变量的 Apollo 客户端查询

【英文标题】：React - Apollo Client query with input variables

【发布时间】：2021-04-13 02:08:27

【问题描述】：

我正在努力理解如何在 react 中使用 apollo 客户端查询内容。

这是查询id想实现的：

query signIn 
  signIn(input:  email: "[e-mail]", password: "test123" ) 
    token
  

我想将所有查询保存到查询文件夹中，所以我做了以下操作：

import  gql  from '@apollo/client';

export const SIGN_IN = gql`
  
    signIn(input:  email: $email, password: $password ) 
      token
    
  
`;

我在主页内调用我的查询，如下所示：

import  useQuery  from '@apollo/client';
import  SIGN_IN  from '../../apollo/queries/SIGN_IN';

export const Homepage = () => 
  const  data, loading, error  = useQuery(SIGN_IN, 
    variables: 
      input: 
        email: '[e-mail]',
        password: 'test123',
      ,
    ,
  );

但我最终得到了这个错误：

  "loading": false,
  "error": 
    "graphQLErrors": [],
    "networkError": 
      "name": "ServerError",
      "response": ,
      "statusCode": 400,
      "result": 
        "errors": [
          
            "message": "Variable \"$email\" is not defined.",
            "locations": [
              
                "line": 2,
                "column": 25
              ,
              
                "line": 1,
                "column": 1
              
            ],
            "extensions": 
              "code": "GRAPHQL_VALIDATION_FAILED",
              "exception": 
                "stacktrace": [
                  "GraphQLError: Variable \"$email\" is not defined.",

我应该怎么做？

亲切的问候

【参考方案1】：

好的，找到答案了

如果有人在找这个，那就去吧：

import  gql  from '@apollo/client';

export const SIGN_IN = gql`
  query SIGN_IN($email: String!, $password: String!) 
    signIn(input:  email: $email, password: $password ) 
      token
    
  
`;

【参考方案2】：

查询定义应该是这样的：

export const SIGN_IN = gql`
 query signIn($email: String!, $password: String!) 
    signIn(input:  email: $email, password: $password ) 
      token
    
  
;