第一步. 初始化子View

constructor(props){
  super(props);
  this.state = {

    isChange : true,
    itemView : (<Text>测试1</Text>),
  }
};

第二步. 在render中

<View style={{flex:Util.ScreenHeight-128,justifyContent: 'flex-start',}}>
  {this.state.itemView}
</View>

第三步. 在触发事件中动态设置state

let itemView;

var isChange = !this.state.isChange;
if (isChange) {
  itemView = (<Text>测试1</Text>);
} else{
  itemView = (<Text>测试2</Text>);
};
this.setState({
  isChange : isChange,
  itemView : itemView,
});

React Native 实现页面动态切换的更多相关文章

  1. react native 之页面布局

     第一章 flexbox 布局 1.flexDirection:'row', 水平 flexDirection:'column',垂直 需要在父元素上设置这种属性才能实现flex. flex:1 会撑 ...

  2. react native 之页面跳转

    第一章  跳转的实现 1.component  中添加这行代码 <View style={styles.loginmain}> <Text style={styles.loginte ...

  3. jquery实现页面动态切换的方法--toggleClass(className)

    $(function() { $(".A").click(function() { $(this).toggleClass("B"); }); }); 当点击带 ...

  4. react native底部tab栏切换

    1.安装tab栏插件 npm i react-native-tab-navigator --save 2.引入对应的组件和tab插件 import { Platform, StyleSheet, Te ...

  5. 混合开发的大趋势之一React Native之页面跳转

    转载请注明出处:王亟亟的大牛之路 最近事情有点多,没有长时间地连贯学习,文章也停了一个多礼拜,愧疚,有时间还是继续学习,继续写! 还是先安利:https://github.com/ddwhan0123 ...

  6. 混合开发的大趋势之一React Native之页面跳转(2)+物理返回+特定平台代码

    转载请注明出处:这里写链接内容 今天是10月份的最后一天,我加了3个月来的第一个班,挤出了这篇. 废话不多先安利,然后继续学习 RN 有好东西都往里面丢,努力做好归纳 https://github.c ...

  7. [技术博客]React Native——HTML页面代码高亮&数学公式解析

    问题起源 原有博文显示时代码无法高亮,白底黑字的视觉效果不好. 原有博文中无法解析数学公式,导致页面会直接显示数学公式源码. 为了解决这两个问题,尝试了一些方法,最终利用开源类库实现了页面美化. (失 ...

  8. 一次掌握 React 与 React Native 两个框架

    此系列文章将整合我的 React 视频教程与 React Native 书籍中的精华部分,给大家介绍 React 与 React Native 结合学习的方法. 1. 软件开发语言与框架的学习本质 我 ...

  9. React Native之code-push的热更新(ios android)

    React Native之code-push的热更新(ios android) React Native支持大家用React Native技术开发APP,并打包生成一个APP.在动态更新方面React ...

随机推荐

  1. SonarQube的使用入门

    SonarQube的安装.配置与使用 详情请参照原博客:http://www.cnblogs.com/qiaoyeye/p/5249786.html SonarQube是管理代码质量一个开放平台,可以 ...

  2. 安装SQL提示重启电脑失败,解决办法

    1. 打开注册表, 找到HKEY_LOCAL_MACHINE-->software-->Microsof-->MSSQLServer...统统删掉 2.HKEY_LOCAL_MACH ...

  3. SpringMVC学习系列(11) 之 表单标签

    本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. 一.首先我们先做一个简单了例子来对Spring MV ...

  4. XMPP 和 OpenFire

    XMPP XMPP(可扩展消息处理现场协议)是基于可扩展标记语言(XML)的协议,它用于即时消息(IM)以及在线现场探测.是一种数据传输协议. XMPP的前身是Jabber,一个开源形式组织产生的网络 ...

  5. [C#常用代码]类库中读取解决方案web.Config字符串

    对于类库里读取解决方案web.config文件里字符串的方法一.读取键值对的方法:1.添加引用using System.Configuration;2.web.Config配置节<appSett ...

  6. 强大的commons

    在此之前对commons包了解的不多,最常用的就是StringUtils.isBlack(str)来取代if(str !=null && str.lenght()>1)的判断,昨 ...

  7. 如何将win7变为wifi热点

    以前经常使用connectify软件一键设置win7热点,但发现该软件影响开机速度,于是研究了一下win7自带的wifi功能,简单方便,分享如下: 1.打开命令提示符: [开始]/搜索框中输入“cmd ...

  8. 集成IC刷卡器经验

    因为一系列的原因,IC刷卡器要渐渐地取代磁条刷卡器.公司在这方面也是需要跟进的,在我负责集成IC刷卡器到应用程序的过程中,积累了些经验,现在分享下. 第一:无论是磁条还是IC刷卡器都是刷卡器的一种,所 ...

  9. JAVA 多线程和并发学习笔记(四)

    1. 多进程 实现并发最直接的方式是在操作系统级别使用进程,进程是运行在它自己的地址空间内的自包容的程序.多任务操作系统可以通过周期性地将CPU从一个进程切换到另一个进程,来实现同时运行多个进程. 尽 ...

  10. jquery 农历日历 可自适应

    在网上找了许多大牛做的农历日历,但是不是不符合项目中的要求,就是本身就有问题有Bug ,把大牛门的做日历看了n遍 自己又改造了一遍得到了这个:随后日历又要做个自适应的长宽,又在js中改造代码..... ...