如何从 child 调用与 parent 屏幕同级的屏幕？（请查看提供的图片）

Question

我一直在使用 react-native 构建应用程序并遇到导航问题。我正在使用 react-navigation，其中有带水箱和滤网的堆栈导航器。坦克屏幕有一个带有地图和列表屏幕的选项卡导航器，如下图所示。

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

我试过了this.props.navigation.navigate('filterScreen');来自地图和列表但它不起作用（我知道这不会起作用但仍然尝试过）。

有什么方法可以导航吗？任何线索将不胜感激。

编辑：一堆坦克（最上面的屏幕）

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。

如何从 child 调用与 parent 屏幕同级的屏幕？ （请查看提供的图片）

How to call a screen which is a sibling to parent screen from a child? (please look at the image provided)

react-native

react-navigation

如何从 child 调用与 parent 屏幕同级的屏幕？（请查看提供的图片）