react-apollo与 redux 一起使用时,来自服务器的数据缓存在 redux 存储中的一个apollo键下:
{
apollo: // results from Apollo queries
}
创建您自己的减速器和相应的状态树后,您的商店可能如下所示:
{
apollo: { ... },
ui: {
selectedItem: 2;
showItems: 6
}
}
想象一下,有一个动作改变了 的值ui.selectedItem,这个值是埋在apollo对象中某处的项目的索引。
使用reducer composition,我们uistate 的reducer将无法访问 Apollo 状态下的任何内容。
在我们的组件中,我们可以通过 订阅我们ui状态的变化mapStateToProps,并且我们可以使用react-apolloGraphQL 容器(或@graphql装饰器)将 Apollo 结果映射到 props 。
但是我们如何使用从 Apollo 结果和应用程序中的其他状态计算的值来更新我们的存储?
例如,如果apollo.item.list是一个项目数组,并且ui.selectedItem是您要在该列表中定位的索引 - 商店如何包含以下值:
apollo.item.list[ui.selectedItem]