Question

有多种方法（据我所知2种）来使用Apollo的新Query和Mutation道具。但是，我只能成功实现其中之一。

在Query属性中定义查询，如下所示：

            Array
            (
                [0] => Array
                    (
                        [0] => 1882
                        [1] => 52.12
                    )

                [1] => Array
                    (
                        [0] => 2018
                        [1] => 52.23
                    )

                [2] => Array
                    (
                        [0] => 1883
                        [1] => 52.35
                    )

                [3] => Array
                    (
                        [0] => 1876
                        [1] => 52.62
                    )

                [4] => Array
                    (
                        [0] => 1979
                        [1] => 52.76
                    )

                [5] => Array
                    (
                        [0] => 1950
                        [1] => 53.22
                    )

                [6] => Array
                    (
                        [0] => 1996
                        [1] => 53.41
                    )

                [7] => Array
                    (
                        [0] => 1880
                        [1] => 54.67
                    )

                [8] => Array
                    (
                        [0] => 1990
                        [1] => 57.58
                    )

                [9] => Array
                    (
                        [0] => 2011
                        [1] => 73.28
                    )

            )

工作并将我的数据从数据库中带回进行渲染

但是当我尝试将查询作为预格式化的对象传入时，会导致状态400错误的请求错误：

 <Query query={gql`
          {
            getStudies{
              studies_id
              name_studies
              lab_studies
              objective_studies
              active_studies
            }
          }
          `}>
            {({ loading, error, data }) => {
              if (loading) return <div>Fetching</div>
              if (error) return <div>Error</div>
              const studiesToRender = data.getStudies;
              return(
              <div>
                {studiesToRender.map(study => <Study key={study.studies_id} study={study}/>)}</div>    
              )
            }}
          </Query>

这是服务器端typeDef和解析器：

const LIST_STUDIES = gql`
  {
    ListStudies{
      getStudies {
        studies_id
        studies_name
        studies_lab
        studies_objective
        studies_active
      }
    }
  }`
....
 <Query query={LIST_STUDIES}>
            {({ loading, error, data }) => {
              if (loading) return <div>Fetching</div>
              if (error) return <div>Error</div>
              const studiesToRender = data.ListStudies.getStudies;
              return(
              <div>
                {studiesToRender.map(study => <Study key={study.studies_id} study={study}/>)}</div>    
              )
            }}
          </Query>

我更喜欢第二种实现，因为它对于突变和传递状态值似乎更加灵活。如果我忘记提及任何事情或需要澄清的事情，请告诉我。

干杯：）

编辑：我正在使用pg-promise包连接到本地PostgreSQL数据库

Answer 1

问题是这两个查询不相同，第二个查询的格式不正确。这是第一个：

{
  getStudies {
    studies_id
    name_studies
    lab_studies
    objective_studies
    active_studies
  }
}

第二个：

{
  ListStudies {
    getStudies {
      studies_id
      studies_name
      studies_lab
      studies_objective
      studies_active
    }
  }
}

第二个查询用不必要的大括号括起来。

GraphQL允许在编写文档时使用简写符号，该文档允许您省略操作名称和操作类型（query，mutation或subscription）。如果省略操作类型，则假定该操作为查询。最好避免在实践中使用速记符号，并且始终同时包括名称和操作类型。结果查询如下：

query SomeOperationName {
  getStudies {
    studies_id
    name_studies
    lab_studies
    objective_studies
    active_studies
  }
}

阿波罗查询道具的不同实现

1 个答案: