时间戳

首页 > 解决方案 > React Native Navigation 子级父级

javascript - React Native Navigation 子级父级

问题描述

我一直在尝试制作导航组件，但遇到了错误。

这是我的 StackNavigation 视图的架构： 

const App = createStackNavigator({
    Register:{
        screen:Registration,
    },
    Home: {
        screen: SwipeNavigator({

            Home: {
                screen: Record,
                left: 'QRcode',
                right: 'Conv',
                top: 'Profil',

            },

            QRcode: {
                screen: QRcode,
                type:'push'
            },

            Conv: {
                screen: Conversation,
                type:'push'
            },
            Profil: {
                screen: Profil,
                type:'push'
            },



        }),
        navigationOptions: {
            header: null,
        },
    }
});

不幸的是，当我在 SwipeNavigator 中时，我无法去注册。我收到一个错误，表明 this.props.navigation 未定义。

有谁知道我为什么会遇到这个错误以及如何解决它？

提前感谢您的回复

标签： javascriptnode.jsreactjsreact-nativenavigation

解决方案

我有一个很好的解决方案来解决所有this.props.navigation问题:) 我刚刚从另一个问题中复制/粘贴了我之前的答案。它解释了如何使用它以及如何使用新的 React Navigation Helper 来完成它。如果您对此有任何疑问，我会在这里为您提供帮助。它只会解决您的整个导航问题。

我创建了一个用于处理导航问题的库，并且还阻止了 this.props.navigation 道具的使用。

React 导航助手

用法很简单。在您的 App.js 或导航器上，只需设置全局级别导航器。

import NavigationService from "react-navigation-helpers";


<MainNavigator
  ref={navigatorRef =>
    NavigationService.setGlobalLevelNavigator(navigatorRef)
  }
/>

然后，您可以通过这个简单的代码段在您的项目中使用 ANYWHERE：

NavigationService.navigate("home")

当然，您仍然需要导入 NavigationService :)

您可以在库的 README 中找到更详细的文档。如果您仍有疑问，请随时提出，我很乐意为您提供帮助。

推荐阅读