如何从孩子那里调出父母屏幕的兄弟屏幕？ （请查看提供的图片）

Question

我一直在使用react-native来构建应用程序并面临导航问题。我正在使用反应导航，我有堆栈导航器与坦克和过滤器屏幕。坦克屏幕有一个带有地图和列表屏幕的标签导航器，如下图所示。

由于红线指示我无法从地图或列表导航到过滤屏幕。很抱歉没有提供流向。

我试过这个.props.navigation.navigate（＆＃39; filterScreen＆＃39;）;从地图和列表，但它不起作用（我知道这将无法工作，但仍然尝试过）。

有没有办法导航？非常感谢任何领导。

修改：  一堆坦克（最上面的屏幕）

export const Tank = StackNavigator({
 tankScreen: { screen: TankScreen },
 filterScreen: { screen : FilterScreen },
});

InnerTab表示坦克屏幕的标签导航器。

export const InnerTab = TabNavigator({
    Map: {
        screen: MapStack,
        navigationOptions: {
            tabBarLabel: 'Map',
            tabBarIcon: ( 
                (Platform.OS === 'ios') ?  <Image source={require('../logos/map.png')}
                    style={[styles.icon, {
                        right: (Dimensions.get('window').width / 4),
                    }]}
                /> :  <Image source={require('../logos/map.png')}
                style={[styles.innerTabIcon, {color: '#ffffff'}]}
         />
            )
        },
    },
    List: {
        screen: ListStack,
        navigationOptions: {
            tabBarLabel: 'List',
            tabBarIcon: (
                (Platform.OS === 'ios') ?   <Image source={require('../logos/list.png')}
                    style={[styles.icon, {
                        right: (Dimensions.get('window').width / 4),
                    }]}
                /> :   <Image source={require('../logos/list.png')}
                style={[styles.innerTabIcon, {color: '#ffffff'}]} />
            )
        },
    },
},

请注意，InnerTab中的屏幕不是堆栈。

Answer 1

对于TabNavigator中能够导航StackNavigator的屏幕，他们需要位于同一导航树中。

当屏幕定义是导航器时，这是自动的。

但是，在您的情况下，屏幕是一个内置导航器的组件。

要在两者之间进行连接，您的组件需要公开选项卡导航器的路由器，并传递导航状态：

class TanksScreen extends React.Component {
  render() {
    return (
      <View>
        <InnerTab navigation={this.props.navigation}/>
      </View>
    );
  }
}
TanksScreen.router = InnerTab.router;

请参阅Nesting a Navigator in a Component。