React Navigation--Stack Navigator 详细的例子

最新推荐文章于 2024-09-11 14:17:39 发布

小罗罗诺亚

最新推荐文章于 2024-09-11 14:17:39 发布

阅读量1.7w

点赞数 1

分类专栏： React Native 文章标签： React Navigation StackNavigator

本文链接：https://blog.csdn.net/yibing2011/article/details/71195316

版权

本文将通过一个详细的实例，全面解析React Navigation中的Stack Navigator组件的使用方法，包括导航配置、页面间跳转以及自定义导航栏等核心概念。

摘要由CSDN通过智能技术生成

/**
 * Created by YiBing on 2017/5/5.
 *
 * 一个StackNavigator详细的例子，效果：1个主页面，2个子页面，每个页面有三个按钮，可以跳转到相应的页面。
 *
 * React Navigation -- StackNavigator:
 API Definition--StackNavigator(RouteConfigs, StackNavigatorConfig);
 RouteConfigs--StackNavigator({

  // For each screen that you can navigate to, create a new entry like this:
  Profile: {

    // `ProfileScreen` is a React component that will be the main content of the
screen.
    screen: ProfileScreen,
    // When `ProfileScreen` is loaded by the StackNavigator, it will be given a
`navigation` prop.

    // Optional: When deep linking or using react-navigation in a web app, this path is
used:
    path: 'people/:username',
    // The action and route params are extracted from the path.

    // Optional: Override the `navigationOptions` for the screen
    navigationOptions: ({navigation}) => ({
      title: `${navigat