TabNavigator子屏幕如何引用父StackNavigator？

Question

应用程序的结构就是这样。

• StackNavigator
  • StackA屏幕（TabNavigator的）
    • TabChildA屏幕
    • TabChildB屏幕
    • ...
  • StackB屏幕

App.js

中的代码

const TabComponent = TabNavigator(
{
    TabChildA-Screen: {
    screen: TabChildA,
    },
    TabChildB-Screen: {
    screen: TabChildB,
    }
},
{
    tabBarPosition: "bottom",
    animationEnabled: false,
    swipeEnabled: false
}
);

const StackComponent = StackNavigator(
{
    StackA-Screen: {
    screen: TabComponent,
    navigationOptions: ({ navigation }) => ({
        headerBackTitle: null,
        headerRight: (
        <TouchableWithoutFeedback
            onPress={() =>
            navigation.navigate("StackB-Screen", { space: "" }) // can't navigate to "StackB-Screen".
            }
        >
            <MaterialIcon
            name="playlist-add"
            size={Sizes.NavigationBar.Icon.Size}
            style={{ padding: 8, color: Colors.White }}
            />
        </TouchableWithoutFeedback>
        )
    })
    },
    StackB-Screen: {
    screen: StackB,
    }
},
{
    initialRouteName: "StackA-Screen",
    mode: "modal"
}
);

export default StackComponent;

我想将TabChildA-Screen导航到StackB-Screen。 但是，TabChildA-Screen可以引用navigator navigator为TabNavigator。

TabChildA-Screen

中的代码

import React, { Component } from "react";
import { Button, Text, View } from "react-native";

class StackB extends Component {
constructor(props) {
    super(props);
}

render() {
    return (
    <View
        style={{
        flex: 1,
        justifyContent: "center",
        alignItems: "center"
        }}
    >
        <Button
        onPress={ () =>
            this.props.navigation.navigate("StackB-Screen") // can't navigate to "StackB-Screen".
        }
        title="move to StackB-Screen"
        />
    </View>
    );
}
}

export default StackB;

如何TabChildA-Screen参考StackNavigator？