如何迁移示例
this.props.setVariables
从旧的API调用。
this.props.setVariables
旧的API没有直接相同的新API。 这个变化的一个重要原因是新的内核不再追踪如何从查询中提取任何特定的子树。这使得新内核更快,但需要明确的查询来获取新数据。看看这四种不同的情况:
initialVariables
#
如果组件不实际使用 setVariables()
, 就使用 initialVariables
JS 和 GraphQL 之间共享值, 则有两种备选方法:
# PAGE_SIZE
)进行注释。
典型 Relay Classic 代码:
// counterexample this.props.relay.setVariables({ count: count + 10, }); initialVariables: { count: 10, }, fragment on User { friends(first: $count) { # ... } }
这应该升级到使用 PaginationContainer
.
典型的旧代码:
// counterexample this.props.relay.setVariables({ search: newSearchTerm, }); initialVariables: { search: '', } fragment on User { friends(named: $search, first: 10) { # ... } }
这可以通过使用 RefetchContainer
来进行升级,它允许您指定要使用的查询来获取新数据。
典型的旧代码:
// counterexample this.props.relay.setVariables({ showComments: true, }); initialVariables: { showComments: false, } fragment on FeedbackTarget { comments(first: 10) @include(if: $showComments) { # ... } }
这可以通过有条件地渲染 QueryRenderer
一次渲染后的数据进行升级。新API的代码开销大大降低。
或者RefetchContainer
也可以使用。