编辑:经过一些研究后我发现ReactRelayPaginationContainer现在只支持一个@connection
(中继版本1.0.0)。
我不确定如何使用Relay Modern处理PaginationContainer中的多个Connections,因为我到目前为止看到的唯一示例只包含一个Connection。为了说明我的担忧,下面有一些代码,我遇到了麻烦
export default createPaginationContainer(MyComponent,
{
item: graphql`fragment mycomponent_item on Item {
foos(first: $count_foo, after: $cursor_foo) @connection(key: item_foos) {
pageInfo {
hasNextPage
endCursor
}
edges {
node {
id
...foo_foo
}
}
}
bars(first: $count_bar, cursor: $cursor_bar) @connection(key: item_bars) {
pageInfo {
hasNextPage
endCursor
}
edges {
node {
id
...bar_bar
}
}
}
}
}`
},
{
direction: 'forward',
getConnectionFromProps(props) {
return props.item.foos && props.item.bars;
},
getFragmentVariables(prevVars, totalCount) {
return {
...prevVars,
count: totalCount,
};
},
getVariables(props, {count, cursor}, fragmentVariables) {
return {
count,
cursor,
};
},
query: graphql`
query itemPaginationQuery(
$count_foo: Int!
$cursor_foo: String
$count_bar: Int!
$cursor_bar: String
) {
Item {
... mycomponent_item
}
}
`
});
问题在于Relay Modern的PaginationContainer的ConnectionConfig:
export type ConnectionConfig = {
direction?: 'backward' | 'forward',
getConnectionFromProps?: (props: Object) => ?ConnectionData,
getFragmentVariables?: FragmentVariablesGetter,
getVariables: (
props: Object,
paginationInfo: {count: number, cursor: ?string},
fragmentVariables: Variables,
) => Variables,
query: GraphQLTaggedNode,
};
显然,它仅适用于PaginationContainer中的一个Connection。而createPaginationContainer只接受其中一个ConnectionConfigs的构造函数。
我应该如何在一个PaginationContainer中处理多个连接?