React Native Android 中视图之间的导航示例?

我不需要导航栏，我只想设置视图并向左、向右滑动或弹出视图，仅此而已.我知道是一些基本的东西，但我找不到任何有用的例子.请问，有人可以帮我吗?https://rnplay.org/ 中的任何功能示例?谢谢. 解决方案 UPDATE 04/2018 :自从我第一次回答以来，情况发生了变化，如今有两个庞大的库与导航相关:react-navigation 和 react-native-navigation.我将为 react-navigation 编写一个示例，这是一个易于使用的库和由社区中认真的人维护的完整 JS.首先安装库:yarn 添加反应导航或npm install --save react-navigation然后在您的应用入口点 (index.js) 中:从'./config'导入配置；从'react-native'导入{ AppRegistry}；从反应导航"导入 { StackNavigator };export const AppNavigator = StackNavigator(Config.navigation);AppRegistry.registerComponent('appName', () => AppNavigator);你可以看到我们向StackNavigator传递了一个对象，这是我们所有的屏幕配置，这里是一个配置示例:从./HomeScreen"导入主屏幕；从./SettingsScreen"导入 SettingsScreen；常量配置 = {导航: {家: {屏幕:主屏幕},设置:{屏幕:设置屏幕，}}}现在应用程序知道我们得到的每个屏幕.我们可以简单地告诉导航"功能进入我们的设置屏幕.让我们看看我们的主屏幕:class HomeScene 扩展组件 {构造函数(道具){超级(道具)；}使成为 () {返回 (<按钮标题="转到设置"onPress={() =>this.props.navigation.navigate('设置')}/></查看>);}}如您所见，导航将为道具补水.从这里你可以制作你想要的东西.转到库文档以查看您可以执行的所有操作:更改标题类型、标题、导航类型……以前的回答:看这个例子:https://github.com/h87kg/NavigatorDemo它很有用，而且是一个写得很好的导航器示例，我认为比上面你刚刚写的要好.主要看LoginPage.js和MainPage.js的关系After check the React Native documentation, I still don't understand the best way to create views and navigate between different components.I don't want to use any external components like:https://github.com/Kureev/react-native-navbar/https://github.com/23c/react-native-transparent-barhttps://github.com/superdami/react-native-custom-navigationI don't need a Navigation bar, i just want to set views and slide left, right o pop a view, nothing more.I know is something basic, but I can't find any helpful example.Please, anyone can help me? Any functional example in https://rnplay.org/?Thank you. 解决方案 UPDATE 04/2018 :Things have change since my first answer, and today two massive libraries are relevant for navigation : react-navigation and react-native-navigation.I will wrote an example for react-navigation which is an easy to use library and full JS maintain by serious people from the community.First install the library :yarn add react-navigationornpm install --save react-navigationThen in your app entry point (index.js) :import Config from './config';import { AppRegistry } from 'react-native';import { StackNavigator } from 'react-navigation';export const AppNavigator = StackNavigator(Config.navigation);AppRegistry.registerComponent('appName', () => AppNavigator);You can see that we pass an object to the StackNavigator, it's all ours screens configuration, here is an example of configuration :import HomeScreen from "./HomeScreen";import SettingsScreen from "./SettingsScreen";const Config = { navigation: { Home: { screen: HomeScreen }, Settings: { screen: SettingsScreen, } } }Now the app know each screen we got. We can simply tell the "navigate" function to go to our Setting Screen.Let's watch our Home Screen :class HomeScene extends Component { constructor(props) { super(props); } render () { return ( <View> <Button title="Go to Settings" onPress={() => this.props.navigation.navigate('Settings')} /> </View> ); } }As you can see, the navigation will hydrate the props. And from here you can make what you want.Go to the library documentation to see all you can do : change the header type, the title, navigation type, ...PREVIOUS ANSWER :Watch this example:https://github.com/h87kg/NavigatorDemoIt's useful and a well written Navigator example, better than the one above you just wrote, I think.Mainly watch the relationship between LoginPage.js and MainPage.js 这篇关于React Native Android 中视图之间的导航示例?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！