如何在 react-native 中创建导航栏？

Question

我是 react-native 的新手。我想创建导航 bar/collapsable 下拉菜单，其中应包含主页、博客、注册、登录 button/links。单击该按钮后，它应该导航到相应的页面。

App.js

 import React from 'react';
 import { Blogs } from './app/views/Blogs.js';
 import {Signup } from './app/views/Signup.js;
 import {Login } from './app/views/Login.js;
 import { createAppContainer } from 'react-navigation';
 import { createStackNavigator } from 'react-navigation-stack';
 import { Home } from './app/views/Home.js';

 const AppNavigator = createStackNavigator(
 {
BlogsRT: {
  screen: Blogs
},
HomeRT: {
  screen: Home
},
SignupRT:{
screen: Signup
} ,
LoginRT:{
screen: Login
},
},
{
initialRouteName: 'HomeRT'
}
);

const MyRoutes = createAppContainer(AppNavigator);
 export default class App extends React.Component {
render() {
return (
  <MyRoutes />

);
}

}

Answer 1

如果您正在使用stackNavigator，请在下面的代码中使用它。

this.props.navigation.push('BlogsRT',<pass data>)

如果您正在使用 switchNavigator，请在下面的代码中使用它。

this.props.navigation.navigate('BlogsRT')

注意 :- 你可以在你的按钮点击事件上写这个。

如何在 react-native 中创建导航栏？

How to create navigation bar in react-native?

nav

react-native