Блог

Итак, я пытаюсь выяснить Relay.js . Я создал простое приложение, которое в основном имитирует пример на веб-сайте Relay. Однако, хотя мне удалось избавиться от ошибок в обеих консолях (node и chrome), мой компонент не получает фрагменты, которые я указал в Raley.Контейнер. Я понятия не имею, в чем может быть проблема, поскольку мое приложение выглядит очень похоже на пример Relay.

Обратите внимание, что метод map on this.props.companies недоступен, поскольку это объект с 1 свойством, то есть __dataId__ .

Первый компонент

 class App extends React.Component {
  render() {
    return (
      <div>
        {this.props.companies.map((comapny => <Company company={company} />))}
      </div>
    );
  }
}

export default Relay.createContainer(App, {
  fragments: {
    companies: () => Relay.QL`
      fragment on Companies {
        companies { ${Company.getFragment('company')} }
      }
    `,
  },
});
  

Второй компонент

 class Company extends React.Component {
  render() {
    return (
      <div>
        <h1>{this.props.comapany.name}</h1>
      </div>
    );
  }
}

export default Relay.createContainer(Company, {
  fragments: {
    company: () => Relay.QL`
      fragment on Company {
        __id,
        name
      }
    `,
  },
});
  

И мой маршрут

 class AppHomeRoute extends Relay.Route {
  static routeName = 'Comapnies';
  static queries = {
    companies: (Component) => Relay.QL`
      query {
        companies { ${Component.getFragment('companies')} }
      }
    `,
  };
}
  

Есть идеи?