我已经阅读了the material,但我仍然没有得到它。
显示此示例路线:
var profileRoute = {
queries: {
// Routes declare queries using functions that return a query root. Relay
// will automatically compose the `user` fragment from the Relay container
// paired with this route on a Relay.RootContainer
X: () => Relay.QL`
# In Relay, the GraphQL query name can be optionally omitted.
query { user(id: $userID) }
`,
},
params: {
// This `userID` parameter will populate the `$userID` variable above.
userID: '123',
},
// Routes must also define a string name.
name: 'ProfileRoute',
};
(我已故意将user
替换为上面的X
,但它对生成的GraphQL查询没有影响,以确保它对graphql组合没有影响)
它将与此容器配对:
module.exports = Relay.createContainer(ProfilePicture, {
// Specify the initial value of the `$size` variable.
initialVariables: {
size: 32
},
// For each of the props that depend on server data, we define a corresponding
// key in `fragments`. Here, the component expects server data to populate the
// `X` prop, so we'll specify the fragment from above as `fragments.X`.
fragments: {
X: () => Relay.QL`
fragment on User {
profilePhoto(size: $size) {
uri,
},
}
`,
},
});
这可能会构成这样的事情:
query {
user(id: $userID) {
profilePhoto(size: $size) {
uri
}
}
}
但这里的逻辑是什么?也许它从片段中获取类型User
,然后寻找一种方法来获取该类型作为查询中匹配的东西的直接后代?也就是说,它通过编译GraphQL知道在query { user(id: $userID) { X } }
X中标记了可以找到用户类型的位置。
到目前为止,我见过的唯一例子在路由器中有一个非常简单的线性查询。会更复杂吗?如果您在两个不同的方向上进行查询并最终接近两个不同的User对象源,会发生什么?怎么知道你想要哪一个?我假设不允许这样的查询。我还假设它在这些查询中看到的唯一位置是最深的一点,所以如果您的路由器查询类似query { user(id: "52") { bestFriend } }
,其中bestFriend也是用户,它将为您提供bestFriend而不是用户52。
是否甚至允许查询中包含多个深度级别的查询?我试过了,我收到了这个错误:
不变违规:Relay.QL:预期查询
user
为空。例如,使用node(id: $id)
,而不是node(id: $id) { ... }
也许路线比我想象的更简单?也许你可以做到一个级别的深度?
答案 0 :(得分:1)
构图比你想象的更简单。查询只能具有一个级别的深度,并且组合组件上的相同名称的片段(例如,在这种情况下为X
)基本上会扩展(...fragment
)。
Relay理论上可以支持任意复杂的查询,但现有的解决方案到目前为止已经足够了。这是因为任意复杂的查询可以分解为简单查询和新的顶级组件。
我还假设它在这些查询中唯一看到的地方是最深的一点[...]
但这是一个很好的主意。