react.js 与 apollo 查询 graphql - 错误：对象作为 React 子项无效答案

【问题标题】：react.js with apollo to query graphql - Error: Objects are not valid as a React childreact.js 与 apollo 查询 graphql - 错误：对象作为 React 子项无效
【发布时间】：2019-07-23 01:12:02
【问题描述】：

我在使用 apollo 查询 graphql 端点时遇到问题。这是有问题的代码。

class ChecklistSummaryTime extends Component {
constructor(props) {
    super(props);
    this.state = {
       data: [],
       sitePath: window.location.pathname
    }
 }

 render() {
     return(
        <ApolloProvider client={getGraphqlClient()}>
            <Query query={gql`
                {
                    all_checklist_time (checklist_type: "backup", order_by: "check_year check_month", 
                            sort_order: "desc desc", group_by: "check_month check_year") {
                            quarter,
                            month,
                            year
                    }
                }
            `}>
            {({ loading, error, data }) => {
                if (loading) return "Loading...";
                if (error) return `Error! ${error.message}`;
                console.log(data);
                return data;
            }}
            </Query>
        </ApolloProvider>
     );
 }}

它有错误“错误：对象作为 React 子级无效（找到：带有键 {all_checklist_time} 的对象）。如果您打算渲染一组子级，请改用数组。”

请帮我弄清楚 gql 部分出了什么问题？

谢谢

【问题讨论】：

标签： javascript reactjs graphql

【解决方案1】：

您看到的错误意味着 return data 正在返回一个对象，该对象不是有效的 React 子对象。您应该将其转换为数组、文本或组件。如果all_checklist_time 是一个数组，则只需return data.all_checklist_time。

【讨论】：