RN开发-Navigator
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的更多相关文章
- iOS原生混合RN开发最佳实践
iOS原生混合RN开发详解 做过原生iOS开发或者Android开发的同学们肯定也都了解Hybrid,有一些Hybrid的开发经验,目前我们企业开发中运用最广泛的Hybrid App技术就是原生与H5 ...
- 基于RN开发的一款视频配音APP(开源)
在如今React.ng.vue三分天下的格局下,不得不让自己加快学习的脚步.虽然经常会陷入各种迷茫,学得越多会发现不会的东西也被无限放大,不过能用新的技术作出一些小项目小Demo还是会给自己些许自信与 ...
- RN开发第二天
今天上午配置了windows的Android的环境,下载node,Python,安装Android SDK和Android studio,JSK,然后配置用户变量和系统变量,然后npm install ...
- RN 开发工具及发布release版本
2.1.开发工具推荐visual studio code https://code.visualstudio.com/docs/?dv=win 选择安装react native tool 就可以了 2 ...
- RN开发-Android原生交互
在使用RN开发过程中,难免有些原生功能需要要自己来实现,下面总结一下在使用RN与原生开发交互. 1.在原生代码中定义实现类 1.1 首先继承 ReactContextBaseJaveModule抽象 ...
- RN开发-IDE和API
一.开发工具 1.Visual Studio Code:微软IDE,轻量级,只有30+M大小 2.nuclide :仅支持Mac 3.WebStorm : JavaScript开发工具(IDE) 二. ...
- RN开发中的报错以及告警
报错一: Attempted to transition from state `RESPONDER_INACTIVE_PRESS_IN` to `RESPONDER_ACTIVE_LONG_PRES ...
- 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 ...
- RN开发-组件View,Text
1.外联js文件(RN自定义组件) module.exports=Header; 导出模块 const Header=require('./header'); 导入外部j ...
随机推荐
- 源码浅析:MySQL一条insert操作,会写哪些文件?包括UNDO相关的文件吗?
DML操作的大致流程 在解答上述疑惑之前,我们来梳理一下DML操作的大致流程: 1.语法解析.语义解析 2.生成执行计划 3.事务修改阶段 1) 激活事务,事务状态由not_active变为activ ...
- 特殊符号unicode编码
包括箭头类.基本形状类.货币类.数学类.音乐符号类.对错类.星星类.星座类.国际象棋类.扑克牌类.希腊字母.十字类.法律符号.标点符号,详情见以下网址:http://caibaojian.com/un ...
- Binder 原理整理
linux进程间通信方式 1. 管道 管道的实质是一个内核缓冲区,管道的作用正如其名,需要通信的两个进程在管道的两端,进程利用管道传递信息.管道对于管道两端的进程而言,就是一个文件,但是这个文件比较特 ...
- MySQL 8 备份与恢复
备份应用的场景包括:系统崩溃.硬件故障.用户错误.升级MySQL Installation.传输MySQL Installation到另一台机器.设置复制等. Slave Server备份 在备份Sl ...
- 在腾讯云上配置.NetCoreWeb
1.购买服务器 2.远程登录(账号密码在上图铃铛里的消息里) 3.安装iis 3.安装.NetCore相关 下载最新版本.NET Core Windows Server Hosting https:/ ...
- css3基本选择器+属性选择器+动态伪类+UI状态伪类+结构类
后代选择器 祖先元素 后代元素{ } 子元素选择器(直接子元素选择器) 父元素>子元素{ } 兄弟选择器 元素+兄弟元素(紧邻该元素之后的下一个兄弟元素) 所有兄弟元素选择器 元素~兄弟元素(该 ...
- css权值和优先级+命名规范
选择器权值: 标签选择器:1 类选择器和伪类选择器:10 ID选择器:100 通配符选择器:0 行内样式:1000 !important 在一定条件下,优先级最高 常用的css样式命名 页面结构页头: ...
- Docker实战部署JavaWeb项目-基于SpringBoot
最近在滴滴云上看到服务器很便宜,1核2G,1年只需要68块钱.下面是我基于Docker部署Javaweb服务的过程.目前我见过的最便宜的服务器,阿里云打折的时候都没有这么便宜啊,果断入手.有需要的话可 ...
- 剑指offer-面试题41-数据流中的中位数-堆
/* 题目: 链接:https://www.nowcoder.com/questionTerminal/9be0172896bd43948f8a32fb954e1be1 来源:牛客网 如何得到一个数据 ...
- Maximum Element In A Stack Gym - 102222A【思维+栈】
2018-2019 ACM-ICPC, China Multi-Provincial Collegiate Programming Contest https://vjudge.net/problem ...