React Navigation 5.x详解

一、 React Navigation简介

在多页面应用程序中,页面的跳转是通过路由或导航器来实现的。在RN应用开发过程中,早期的路由可以直接使用官方提供的Navigator组件,不过从0.44版本开始,Navigator被官方从react native的核心组件库中剥离出来,放到react-native-deprecated-custom-components的模块中,并且Navigator组件也不再被官方推荐使用。此时,我们可以选择由React Native社区开源的一款路由导航库React Navigation。

和之前的版本一样,React Navigation支持的导航类型有三种,分别是StackNavigator、TabNavigator和DrawerNavigator。

  • StackNavigator:包含导航栏的页面导航组件,类似于官方的Navigator组件。
  • TabNavigator:底部展示tabBar的页面导航组件。
  • DrawerNavigator:用于实现侧边栏抽屉页面的导航组件。

1.1 安装

使用React Navigation之前,需要在你的React Native项目中安装所需的软件包,安装的方式分为npm和 yarn两种方式,如下所示。

npm install @react-navigation/native
xiangzhihong8 CSDN认证博客专家 HTTPS 前端框架 JavaScript
著有《React Native移动开发实战》、《Kotlin入门与实战》、《Weex跨平台开发与实战》、《React Native开发进阶》和《Flutter跨平台开发实战》,正努力完成《Android应用架构实战》
已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 成长之路 设计师:Amelia_0503 返回首页
实付 19.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值