RN(react native)入坑指南-07,使用navigator实现页面跳转

本文档简要介绍了如何在React Native应用中使用Navigator组件进行页面跳转,包括设置初始页面、定义页面动画效果以及利用navigator对象进行页面操作如push、pop和jump。
摘要由CSDN通过智能技术生成
前言

  此文完全参考React-Native中文社区的博客新手理解navigator的教程而来,建议直接跳转链接进行详细学习,为防止链接失效或不可抗力因素无法访问,个人整理简单记录如下.

开始

由于前一篇文章将代码进行了分层整理,所以我们的index.android.js已经变得相对简洁


index.android.js

'use strict';

import React,{Navigator,AppRegistry} from 'react-native';

{
  /**引入Login组件 */}
import Login from './src/login/Login.js';

class TaraRn extends React.Component {
   

  render() {
    {
  /** 默认组件名称以及默认组件 */}
    let defaultName = "Login";
    let defaultComponent = Login;

    return (
     <Navigator          
          //初始化组件
          initialRoute={
  { name: defaultName, component: defaultComponent }}    
          //页面切换效果 
          configureScene={(route) => {
            return Navigator.SceneConfigs.VerticalDownSwipeJump;
          }}
          renderScene={(route, navigator) => {
            let Component = route.component;
            
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值