1、在入口组件render方法中返回<Navigator>
            let defaultName = 'Welcome';
            let defaultCompenent = Welcome;            
            <Navigator
                initialRoute={{name:defaultName,component:defaultCompenent}}
                /*configureScene={
                    (route) => {
                        //页面转跳动画 node_modules/react-native/Libraries/CustomComponent/navigate/
                        return Navigator.SceneConfig.VerticalDownSwipeJump;
                    }
                }*/
                renderScene={
                    (route,navigator)=>{
                        let Component = route.component;
                        return <Component {...route.params} navigator={navigator}></Component>;
                    }
                }
            />
        2、在Welcom组件的点击事件中修改转跳页面信息并添加参数
            pressButton(){
                const {navigator} = this.props;                
                const self = this;
                /* 上文中,<Component {...route.params} navigator={navigator} 中传递了navigator作为props */
                if(navigator){
                    navigator.push({
                        name: 'Detail',
                        component: Detail,                
                        params:{
                            author:this.state.author,
                            user:this.props.user,
                            getResult: function(res){
                                self.setState({
                                    result:res
                                })
                            }
                        }
                    })
                }
            }
        3、在Detail组件中携带参数返回
            (1)、接收参数
                //生命周期方法
                componentDidMount(){
                    this.setState({
                        author:this.props.author,
                        user:this.props.user
                    });
                }
            (2)、携带参数返回
                backButton(){
                    const {navigator} = this.props;
                    
                    if(this.props.getResult){
                        let result = USER_MODELS[1];
                        this.props.getResult(result);
                    }
                    
                    if(navigator){
                        // 入栈出栈,把当前页面pop掉
                        navigator.pop();
                    }
                }

RN开发-Navigator的更多相关文章

  1. iOS原生混合RN开发最佳实践

    iOS原生混合RN开发详解 做过原生iOS开发或者Android开发的同学们肯定也都了解Hybrid,有一些Hybrid的开发经验,目前我们企业开发中运用最广泛的Hybrid App技术就是原生与H5 ...

  2. 基于RN开发的一款视频配音APP(开源)

    在如今React.ng.vue三分天下的格局下,不得不让自己加快学习的脚步.虽然经常会陷入各种迷茫,学得越多会发现不会的东西也被无限放大,不过能用新的技术作出一些小项目小Demo还是会给自己些许自信与 ...

  3. RN开发第二天

    今天上午配置了windows的Android的环境,下载node,Python,安装Android SDK和Android studio,JSK,然后配置用户变量和系统变量,然后npm install ...

  4. RN 开发工具及发布release版本

    2.1.开发工具推荐visual studio code https://code.visualstudio.com/docs/?dv=win 选择安装react native tool 就可以了 2 ...

  5. RN开发-Android原生交互

    在使用RN开发过程中,难免有些原生功能需要要自己来实现,下面总结一下在使用RN与原生开发交互. 1.在原生代码中定义实现类 1.1  首先继承 ReactContextBaseJaveModule抽象 ...

  6. RN开发-IDE和API

    一.开发工具 1.Visual Studio Code:微软IDE,轻量级,只有30+M大小 2.nuclide :仅支持Mac 3.WebStorm : JavaScript开发工具(IDE) 二. ...

  7. RN开发中的报错以及告警

    报错一: Attempted to transition from state `RESPONDER_INACTIVE_PRESS_IN` to `RESPONDER_ACTIVE_LONG_PRES ...

  8. RN开发-Linux开发环境搭建(Ubuntu 12.04)

    1.首先安装JDK 2.安装Android开发环境 3.安装node.js 3.1 官网下载 : node-v6.9.1-linux-x64 3.2 添加环境变量 sudo vi /etc/profi ...

  9. RN开发-组件View,Text

    1.外联js文件(RN自定义组件)        module.exports=Header; 导出模块         const Header=require('./header'); 导入外部j ...

随机推荐

  1. Linux学习Day5:Vim编辑器、配置网卡、配置Yum软件仓库

    今天首先学习Vim编辑器的使用,通过它可以对Linux系统的文件进行编写和修改.在Linux系统中一切都是文件,所以熟练掌握Vim编辑器的使用十分重要.最后通过配置主机网卡的实验,来加深Vim编辑器中 ...

  2. KINDLE 小说下载--超级书库

       网址:https://shuayouxi.cn/

  3. for循环嵌套练习题or99乘法表

    //输出1-10之间的和 public static void whileTest(){ //定义变量用于存储不断变化的和 int sum = 0; //定义变量,用于记录不断变化的被加数 int x ...

  4. 将short类型转换为char类型

    void short2char(uint8_t *arr1, uint16_t *arr2, int len) { ; ; for (x; x < len; x++) { arr1[x++] = ...

  5. php压缩文件zip格式并打包(单个或多个文件压缩)

    最近接到一个需求,就是选择多个文件下载时,不要一个一个下载,直接把多个文件打包成一个文件进行下载.我们项目是前后端分离,所以我写了个接口,让前端传参数,后台下载. 废话不多说,直接上代码: 先是压缩单 ...

  6. 【IDE】IDEA - 使用问题记录

    1.显示方法API:类似eclipse把鼠标放到方法上有api信息. setting/keymap中搜索 quick docs:(有说默认快捷键是ctrl+q,但我的不是待查找快捷键) 2.forea ...

  7. mac 电脑画图软件相关

    sketchbook 免费但是不太好用 sketch, https://www.newasp.net/soft/327640.html 注意:安装前,请开启任何来源.OS X 10.12 及以上版本请 ...

  8. 覆盖的面积 HDU - 1255 线段树+扫描线+离散化 求特定交叉面积

    #include<cstdio> #include<map> #include<algorithm> using namespace std; ; struct N ...

  9. svn error: "Previous operation has not finished; run 'cleanup' if it was interrupted"

    出现这种问题,有几个原因 1.本身文件确实是锁住了 2.之前clean up 过很多次,但是每次都可能以失败告终,造成work queue存在缓存队列 3.svn lock 有lock记录 以下是简单 ...

  10. 1.Docker Compose

    一.Docker Compose 简介 概述 Compose 项目是 Docker 官方的开源项目,负责实现对 Docker 容器集群的快速编排.从功能上看,跟 OpenStack 中的 Heat 十 ...