Reactjs 反应导航：嵌套堆栈和选项卡导航器

我在

StackNavigator

中有一个

TabNavigator

。由于

TabNavigator

没有标题（据我所知），我无法在选项卡中的不同类中定义标题。因此，我尝试在初始化

StackNavigator

时定义它。顶部会出现一个按钮，但按下该按钮会导致重定向到未定义位置的错误。可能

this.props.navigator.navigate

部分包含错误，其中

this

没有引用我希望它引用的内容，但我在任何地方都找不到正确的语法

const NestedNavigator = createBottomTabNavigator ({
  "route1" : {screen : Screen1,
  },
  "route2" : Screen2,
  "route3" : Screen3
  }, 
);

const Navigator = createStackNavigator ({
  "routeA" : ScreenA,
  "routeB" : {
    screen : NestedNavigator, 
    navigationOptions: { headerRight: (<Button title="home" onPress={() => this.props.navigation.navigate("routeC")}/>)}},
  "routeC" : ScreenB},
  {
    initialRouteName: "routeA",
  }
);

const NestedNavigator=createBottomTabNavigator({
“路由1”：{屏幕：屏幕1，
},
“路由2”：屏幕2，
“路由3”：屏幕3
}, 
);
const Navigator=createStackNavigator({
“路线A”：屏幕A，
“路由B”：{
屏幕：NestedNavigator，
导航选项：{headerRight:{this.props.navigation.navigate（“routeC”）}/>）}，
“routeC”：ScreenB}，
{
初始路由名称：“路由”，
}
);

导航选项

是组件的静态属性，它不引用组件的实例，因此没有可用的道具。相反，如果我们将

navigationOptions

作为一个函数，那么React-Navigation将使用一个包含

{Navigation，navigationOptions，screenProps}

的对象调用它——在这种情况下，我们只关心

Navigation

，它与

this.props.Navigation

传递给屏幕道具的对象相同

navigationOptions = ({ navigation }) => { 
  return {
    headerRight: <Button title="home" onPress={() => 
                   navigation.navigate("routeC")}/>
  }
}

navigationOptions=（{navigation}）=>{
返回{
头灯：
导航。导航（“路由”）}/>
}
}