Я пытаюсь научиться пользоваться реактивной навигацией. У меня есть небольшой кусочек кода здесь:
import React from 'react';
import {AppRegistry} from 'react-native';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator} from 'react-navigation-stack';
import { createDrawerNavigator} from 'react-navigation-drawer';
import {View,Text,Button} from 'react-native';
class Sub extends React.Component {
static navigationOptions = ({screenProps,navigationOptions,navigation}) => ({
headerTitle: () => (
<Button
onPress={() => navigation.openDrawer()}
title="Open Drawer"
/>
),
headerRight: () => (
<Button
onPress={() => screenProps.navigate("Sub2")}
title="Go Sub2"
/>
)
});
render() {
const props = this.props;
return (
<View>
<Text>{props.navigation.state.routeName}</Text>
<Button onPress={_=>props.navigation.navigate("Sub1")} title="Sub1" />
<Button onPress={_=>props.navigation.navigate("Sub2")} title="Sub2" />
</View>
);
}
}
const SubRoutes = {
"Sub1":Sub
};
const SubNavigator = createStackNavigator(SubRoutes);
const MainRoutes = {
"Main1":SubNavigator
};
const MainNavigator = createDrawerNavigator(MainRoutes);
const App = createAppContainer(MainNavigator);
AppRegistry.registerComponent("nav", () => App);
Он создает экран с заголовком с одной кнопкой с надписью «Открыть ящик» и другой с надписью «Go Sub2». Когда я нажимаю кнопку «Открыть ящик», меню ящика открывается, как и ожидалось. Когда я нажимаю «Go Sub2», приложение вылетает с ошибкой screenProps.navigate
не определяется. screenProps.navigation.navigate
также выдает похожие ошибки. Как получить "Go Sub2" для запуска StackNavigator для загрузки экрана Sub2?
Я полагаю, что основной источник моего замешательства - как получить доступ к объекту navigation
в StackNavigator вместо DrawerNavigator.