Question

根据https://www.apollographql.com/

我有一个组件：

typeof<System.Byte>

据我了解，它应该仅在获取数据时呈现数据，否则应呈现const OrganizationsList = () => ( <Query query={gql` {searchOrganizations(count: 10, offset: 0) { id, legalBusinessName, shops { shopId, shopVersion, organizationId, sortIndex, alternativeName } } } `} > {({ loading, error, data }) => { if (loading) return <p>Loading...</p> if (error) return <p>Error :(</p> console.log(data.searchOrganizations) return data.searchOrganizations.map((organization, index) => ( <div key={index}> <p>{`${organization.id}: ${organization.legalBusinessName}`}</p> </div> )) }} </Query> ) class ListOrganizationsPage extends Component { render() { return ( <OrganizationsList /> ) } }。

然而，loading被渲染，没有别的。在控制台中，会记录数据，然后弹出此错误：

未捕获（在promise中）错误：Query.render（）：必须返回有效的React元素（或null）。您可能已经返回undefined，一个数组或其他一些无效的对象。

我在这里缺少什么？

Answer 1

是不是因为你返回一个数组而不是一个React元素。应该是

return (<div>
  { 
    data.searchOrganizations.map((organization, index) => (
        <div key={index}>
          <p>{`${organization.id}: ${organization.legalBusinessName}`}</p>
        </div>))}
   </div>)

为什么Apollo GraphQL没有渲染？

1 个答案: