我有一个GraphQL服务器运行，其架构大致如下：
type Card {
id: String!
name: String
}
type Query {
card(name: String!): Card
cards(power: String): [Card]
}
请注意，我对单张卡有查询，但也有多张卡 . 当我使用GraphIQl UI并进行类似“查询{卡片{名称}}的查询”时，我会按预期返回一系列卡片 .
但是，我有一个RelayContainer正在进行相同的查询，但返回的道具只是第一个结果，而不是结果数组 .
class MyApp extends React.Component {
render() {
return (
<div>
<h1> Hello world!</h1>
<CardList cards={this.props.cards} />
</div>
);
}
}
export default Relay.createContainer(MyApp, {
fragments: {
card: () => Relay.QL`
fragment on Card {
name
}
`,
cards: () => Relay.QL`
fragment on Card {
${CardList.getFragment('cards')}
}
`
},
});
和ListList组件使用Container设置如下：
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 回答
您可能需要在
cards查询片段上使用@relay(plural: true)指令 . Relay repo中有一个复数字段的示例in the Star Wars example .但是，如果您关心分页，则可能需要连接而不是复数字段 . 连接描述为in the Relay docs并在graphql-relay-js中实现 .