Question

什么可以使GraphGL查询返回没有结果？在这里，我有一个组件，通过Apollo-React的compose（）函数在其props中接收查询结果。由于我不理解的原因，查询不返回某些$ companyId的结果，并且组件没有在其props中获取所希望的对象。与其他给定的$ companyId一起运作良好。

道具中的错误对象设置为＆＃39; undefined＆＃39;。

独立播放时（在GraphiQl或Graphcool控制台中），查询效果很好并返回结果。

当我删除＆＃34; aliasMail＆＃34;在查询中的字段，然后它始终正常工作（对于所有给定的$ companyId）。

types.graphql

type Company @model {
  id: ID! @isUnique
  name: String
  dateCreation: DateTime
  dateUpdate: DateTime
  active: Boolean @defaultValue(value: true)
  aliasMail: String @defaultValue(value: "")
  defaultClientAccountLabel: String @defaultValue(value: "")
  defaultSupplierAccountLabel: String @defaultValue(value: "")

queries.js

query getCompanyForAliasEmailEditForm($companyId: ID) {
  Company(id: $companyId) {
    id
    name
    aliasMail
  }
}

EmailSettingsContainer.jsx

import { compose, graphql } from "react-apollo";
import Queries from "../../queries/queries";
import EmailSettings from '../../components/Email/EmailSettings';
import React, { Component } from 'react';

class EmailSettingsContainer extends Component {
  ...
  render(){
  return <EmailSettings
      companyToEdit={this.props.company}
    />
  }
}

export default compose(
  graphql(Queries.getCompanyForAliasEmailEditForm, { name: "company" })
)(EmailSettingsContainer);

控制台

when it works:

PROPS : {companyToEdit: {…}, update: ƒ, sendNotification: ƒ, match: {…}, location: {…}, …}
  companyToEdit:
    Company:
     aliasMail: "CHTIHOUSE"
     id: "cje734xv29fzw0112pn6oxvt1"
     name: "CHTIHOUSE"
     __typename: "Company"
 Symbol(id): "Company:cje734xv29fzw0112pn6oxvt1"
  error: undefined

 when it do not works:

 PROPS :  {companyToEdit: {…}, update: ƒ, sendNotification: ƒ, match: {…}, location: {…}, …}
   companyToEdit:    (Nothing)
     error: undefined

Answer 1

我的错误是我没有管理'加载数据'：而对于其他companyId，查询结果已经在缓存中，对于其他人，查询必须从服务器获取数据。在加载数据之前渲染组件导致我的组件崩溃（因为数据尚未可用）。

按如下方式更新我的组件解决了我的问题：

EmailSettingsContainer.jsx

import { compose, graphql } from "react-apollo";
import Queries from "../../queries/queries";
import EmailSettings from '../../components/Email/EmailSettings';
import React, { Component } from 'react';

class EmailSettingsContainer extends Component {
  ...
  render(){
    if (this.props.company.loading) {
      return ( <div>Loading</div> )
    } else {
      return (
        <EmailSettings
          companyToEdit={this.props.company}
          update={values => this.save(values)}
          sendNotification={this.props.sendNotification}
        />
      )
    }
  }
}

export default compose(
  graphql(Queries.getCompanyForAliasEmailEditForm, { name: "company"}),
)(EmailSettingsContainer);

GraphQL：查询返回没有错误的结果

1 个答案: