应用程序.js:
import React, { Component } from 'react';
import {View,Text} from 'react-native';
import { createDrawerNavigator } from 'react-navigation-drawer';
import {createAppContainer} from 'react-navigation';
import Epics from './screens/tmp';
import Pager from './screens/Pager';
const DrawerNavigator = createDrawerNavigator({
Home: {screen: Epics},
Page: {screen: Pager}
},{initialRouteName: 'Home'});
const Stack = createAppContainer(DrawerNavigator);
export default class App extends Component {
render() {
return <Stack />;
}
}
Run Code Online (Sandbox Code Playgroud)
尝试通过自定义组件导航到屏幕:
import { ActivityIndicator, Image, StyleSheet, View, TouchableHighlight } from 'react-native';
import PropTypes from 'prop-types';
import React from 'react';
import …Run Code Online (Sandbox Code Playgroud) 使用:“@react-navigation/drawer”:“^5.4.0”,“@react-navigation/native”:“^5.1.4”,
应用程序.js:
import { createDrawerNavigator } from '@react-navigation/drawer';
...
const Drawer = createDrawerNavigator();
const DrawerRender = () => {
return (
<NavigationContainer>
<Drawer.Navigator drawerContent={props => <DrawerContent {...props} />}>
<Drawer.Screen name="Home" component={Home} />
<Drawer.Screen name="Screen1" component={Screen1} options={{unmountOnBlur: true, gestureEnabled: false}} />
<Drawer.Screen name="Screen2" component={Screen2} options={{unmountOnBlur: true, gestureEnabled: false}} />
</Drawer.Navigator>
</NavigationContainer>
);}
Run Code Online (Sandbox Code Playgroud)
从屏幕 1:
navigateToPage = page_id => {
this.closeCommentScreen();
this.reopenModal = true;
this.props.navigation.navigate('Screen2', {'page_id': 'testing'});
}
Run Code Online (Sandbox Code Playgroud)
在屏幕 2 上:
export default class Screen2 extends React.Component {
constructor(props) {
super(props);
} …Run Code Online (Sandbox Code Playgroud)