Ios React Native-从内部组件进行导航

在React本机应用程序中，当触摸某些未直接与主

导航器绑定的组件时，如何执行导航

Main // Here I have my main NavigatorIOS
└─TabBar
  └─ListView
    └─Cell // onTap should navigate to a detail page about my cell.

在Xcode中，使用
segue
执行此操作非常简单，甚至可以通过编程实现

是否有方法访问主导航器对象以从独立组件执行导航？
您可以使用。
它的解决方案非常简单，易于使用。它也有堆栈和支持

您可以在路由器中定义屏幕并从任何地方调用它。基本示例如下所示

BasicApp.js . 

import {
  StackNavigator,
} from 'react-navigation';

const BasicApp = StackNavigator({
  Main: {screen: MainScreen},
  Profile: {screen: ProfileScreen},
});  

其中MainScreen和ProfileScreen是您的组件。您可以通过在按下按钮时调用navigate来进行简单的导航

<Button
        title="Go to Jane's profile"
        onPress={() =>
          navigate('Profile', { name: 'Jane' })
        }
      />


导航（'Profile'，{name:'Jane'}）
}
/>
Cell.js:

<Touchable onPress={this.props.onPress}/>



ListView.js：

<Cell onPress={this.props.onPress}/>



Tabbar.js：

<ListView onPress={this.props.onPress}/>



Main.js：

<TabBar onPress={this.onPressCell}/>
OnPressCell=()=> ....whatever you want


OnPressCell=（）=>…你想要什么都行
您可以通过调度一个将由react导航还原器处理的事件来实现这一点

将下面的代码添加到渲染方法中

<TouchableOpacity onPress={() => { this.props.goBack() }}>

这将发送一个操作以转到上一页

如果要导航到任何屏幕，可以使用导航/导航类型

渲染代码：

<TouchableOpacity onPress={() => { this.props.goToPage('HomeScreen') }}>
<TouchableOpacity onPress={() => { this.props.goToPage('OtherScreen') }}>

在你说要使用它之后，我已经进行了测试，但是找不到方法
navigate
<代码>单元格

是整个层次结构的最后一个元素，它位于我的导航器的子元素中。方法

navigate

真的可以被称为那么深吗？你需要在Stack/Tabnavigator中添加这个屏幕，然后在导入它之后使用navigate，比如const{navigate}=this.props.navigation；这是我的观点。根据我的等级，我必须连锁大量的道具。如果我有一个浅层次结构，那么你的解决方案就可以工作，否则就很难维护。你可以使用容器导航器，让组件变哑（包括回调和redux）。所以你只需要在组件完全不可持续的情况下维护容器。也许更好的选择是与Redux集成。

<TouchableOpacity onPress={() => { this.props.goToPage('HomeScreen') }}>
<TouchableOpacity onPress={() => { this.props.goToPage('OtherScreen') }}>

    const mapDispatchToProps = (dispatch) => {
      return {
        goToPage: (page) => {
          dispatch({
            type: 'Navigation/NAVIGATE',
            routeName: page,
            params: {param1, param2}
          })
        }
      }
    }