response.js с apollo для запроса graphql - Ошибка: объекты недопустимы как дочерний элемент React

Question

У меня проблема сact.js с 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?

Спасибо

Answer 1

Ошибка, которую вы видите, означает, что return data возвращает объект, который не является допустимым дочерним элементом React.Вы должны преобразовать это в массив, текст или компонент.Если all_checklist_time является массивом, просто return data.all_checklist_time.