我正在使用我正在使用的本地应用程序react-navigation
我的要求是我有4个不同的屏幕,如典型的实时评分应用
在此应用中,用户可以转到screen 1
的任何匹配页面(屏幕2),他们可以从select 3
或screen 4
转到另一个匹配(screen 2)
,喜欢n种可能性。
现在的问题是我正在使用具有全局存储的redux,每当用户进入新页面时,特定内容将在该状态下加载,如果他选择相同路径的另一页面,即... 2 screen2堆栈中的路由都将指向相同的状态片段,但这两个屏幕具有不同的匹配,我想要这个场景的架构建议主要与状态管理有关
Screen1 - >屏幕2 - >屏幕3 - > screen2 - > screen4 - > screen3 - > screen2 ......
如果屏幕堆栈如上所述,我该如何管理状态。如何克服这种复杂性,请提供宝贵的建议
答案 0 :(得分:1)
通常,我会通过将id
字段作为第二个(navigationState
)参数传递来将路线数据与路线信息分离:
navigation.navigate("MatchPage", { matchId: matchId });
当您将状态映射到道具时,您可以使用第二个参数" ownProps
",它接收传递给底层组件的道具,在本例中为{反应导航提供的{1}}参数:
navigationState
在此示例中,您的应用程序状态包含一个名为const matchContainer = connect(
(state, ownProps) => {
const id = ownProps.navigation.state.params.matchId;
const match = state.matches[id];
return {
match
};
}
);
const MatchPageContainer = matchContainer(MatchPage);
的对象,由matches
键控,您可以使用该对象查找特定于匹配的信息。这是一种常见做法,但您的里程可能会有所不同。