Тип элемента JSX 'Query' не является функцией конструктора для элементов JSX - PullRequest
0 голосов
/ 01 октября 2018

Застрял с этой ошибкой машинописи.Попытка использовать Query компонент из react-apollo.

JSX element type 'Query<any, { id: number; }>' is not a constructor function for JSX elements.
  Property 'setState' is missing in type 'Query<any, { id: number; }>'.
[ts] JSX element class does not support attributes because it does not have a 'props' property.
[ts] Property 'query' does not exist on type '{}'

Версии:

typescript: "^2.9.2",
apollo-boost: "^0.1.16",
react-apollo: "^2.1.11",

Компонент:

import gql from "graphql-tag";
import * as React from "react";
import { Query } from "react-apollo";

const ORGANISATION_QUERY = gql`
  query OrganisationQuery($id: Long!) {
    organisation(id: $id) {
      tasksEnabled
  }}`;

export class FeatureCardGraphQlComponent extends React.Component<{}
{}> {
public render() {
 return (
  <Query query={ORGANISATION_QUERY} variables={{ id: 1 }}>
    {({ data }) => {
      return <div>{data}</div>;
    }}
  </Query>
 );
}}

1 Ответ

0 голосов
/ 01 октября 2018

Похоже, вы пропустили запятую после {}

попробуйте это:

const ORGANISATION_QUERY = gql`
  query OrganisationQuery($id: Long!) {
    organisation(id: $id) {
      tasksEnabled
  }}`;

export class FeatureCardGraphQlComponent extends React.Component<{}, {}> {
public render() {
 return (
  <Query query={ORGANISATION_QUERY} variables={{ id: 1 }}>
    {({ data }) => {
      return <div>{data}</div>;
    }}
  </Query>
 );
}}
...