Как заставить RelayJS понять, что ответ от GraphQL - это массив элементов, а не только один элемент

У меня есть сервер GraphQL, работающий со схемой примерно так:

type Card {
 id: String!
 name: String
}
type Query {
 card(name: String!): Card
 cards(power: String): [Card]
}

Обратите внимание, что у меня есть запрос на одной карте, но также и на нескольких карточках. Когда я использую интерфейс GraphIQl и делаю запрос вроде этого "query {cards {name}}", я возвращаю массив карт, как и ожидалось.

Однако у меня есть RelayContainer, который делает тот же запрос, но реквизиты, которые возвращаются, являются только первым результатом, а не массивом результатов.

class MyApp extends React.Component {
 render() {
 return (
 <div>
 <h1> Hello world!</h1>
 <cardlist cards="{this.props.cards}">
 </cardlist></div>
 );
 }
}
export default Relay.createContainer(MyApp, {
 fragments: {
 card: () => Relay.QL`
 fragment on Card {
 name
 }
 `,
 cards: () => Relay.QL`
 fragment on Card {
 ${CardList.getFragment('cards')}
 }
 `
 },
});

а компонент CardList настроен с помощью контейнера следующим образом:

class CardList extends React.Component {
 render() {
 return <div>{this.props.cards}</div> // UNEXPECTED - this.props.cards is the first card, not an array for me to .map over
 }
}
export default Relay.createContainer(CardList, {
 fragments: {
 cards: () => Relay.QL`
 fragment on Card {
 name
 }
 `,
 },
});

У кого-нибудь есть предложения? Это второй день, когда я погружаюсь в GraphQL и Relay, поэтому я могу сделать очень основную ошибку для всего, что знаю.

1 ответ

Вероятно, вам нужна директива @relay(plural: true) для фрагмента запроса cards. Существует пример множественного поля в действии в примере "Звездных войн" в ретрансляции ретрансляции.

Если вы заботитесь о разбиении на страницы, вы, вероятно, хотите установить соединение вместо множественного поля. Соединения описаны в документах реле и реализованы в graphql-relay-js.

licensed under cc by-sa 3.0 with attribution.