如何在 React Native Navigation 中使用 StackNavigator 避免糟糕的代码

Question

我刚刚开始学习 React Native，在我的导航中，我注意到一些我认为是代码气味的东西，我想知道，我怎样才能做得更好。

所以我正在使用react-navigation和StackNavigator.我确实有一些视图，您必须连续导航，例如视图 1 ->视图 2 ->视图 3 等。但是要从 View2 导航到 View3，我通常会在参数中交接导航项，这样我就可以在其他视图中再次访问它。所以我通常以这样的代码结束：

navigateToDetailPage() {
    const {navigation} = this.props.navigation.state.params;
    navigation.navigate('GameSessionDetailPage', {
        navigation: navigation
    });
}

到目前为止，我现在没有使用 Redux，因为我想先了解基础知识。但是，在这种情况下，我应该将navigation放入 redux 存储中吗？据我了解，redux 应该反映您的应用程序状态，而不是大数据/对象转储。但我觉得我正在进入一长串"导航对象传递"，它看起来很脆弱，而且与我非常耦合。你们会推荐一些最佳实践吗？

Answer 1

不需要传递导航对象。它将自动添加到下一个组件道具中

navigateToDetailPage() {
    const {navigation} = this.props;
    navigation.navigate('GameSessionDetailPage');
}

然后在GameSessionDetailPage您将拥有可用的this.props.navigation。

这里不需要使用 Redux。