这个组件很简单 主要有两个属性:开、关。。。。呵呵哒,,,

import React,{Component}from 'react';
import {
AppRegistry, StyleSheet,
Text,
View,
Switch,
} from 'react-native'; var SwitchDemo = React.createClass({
getInitialState() {
return {
trueSwitchIsOn: true,
falseSwitchIsOn: false,
};
},
render() {
return (
<View style={styles.container}>
<Text>
Swtich实例
</Text>
<Switch
onValueChange={(value) => this.setState({falseSwitchIsOn: value})}
style={{marginBottom:10,marginTop:10}}
value={this.state.falseSwitchIsOn} />
<Switch
onValueChange={(value) => this.setState({trueSwitchIsOn: value})}
value={this.state.trueSwitchIsOn} />
</View>
);
}
});
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
});
AppRegistry.registerComponent('Allen', () => SwitchDemo);

  然后呈现的小效果是~~~~~

React Native控件之Switch开关的更多相关文章

  1. React Native控件只TextInput

    TextInput是一个允许用户在应用中通过键盘输入文本的基本组件.本组件的属性提供了多种特性的配置,譬如自动完成.自动大小写.占位文字,以及多种不同的键盘类型(如纯数字键盘)等等. 比如官网最简单的 ...

  2. 【React Native开发】React Native控件之Image组件解说与美团首页顶部效果实例(10)

    ),React Native技术交流4群(458982758),欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送! Im ...

  3. 【React Native开发】React Native控件之DrawerLayoutAndroid抽屉导航切换组件解说(13)

    ),请不要反复加群! 欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送! 该DrawerLayoutAndroid组件封 ...

  4. 【React Native开发】React Native控件之ProgressBarAndroid进度条解说(12)

    ),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...

  5. React Native控件之Listview

    ListView组件用于显示一个垂直的滚动列表,其中的元素之间结构近似而仅数据不同. ListView更适于长列表数据,且元素个数可以增删.和ScrollView不同的是,ListView并不立即渲染 ...

  6. 【React Native开发】React Native控件之ListView组件解说以及最齐全实例(19)

    ),React Native技术交流4群(458982758).请不要反复加群!欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章 ...

  7. 【React Native开发】React Native控件之RefreshControl组件具体解释(21)

    ),React Native技术交流4群(458982758)种 enabled  bool   android平台适用   用来设置下拉刷新功能是否可用 progressBackgroundColo ...

  8. React Native控件之Picker

    1. import React,{Component}from 'react'; import { AppRegistry, StyleSheet, Text, View, Picker, } fro ...

  9. Robotium源码解读-native控件/webview元素的获取和操作

    目前比较有名的Uitest框架有Uiautomator/Robotium/Appium,由于一直对webview元素的获取和操作比较好奇,另外Robotium代码量也不是很大,因此打算学习一下. 一. ...

随机推荐

  1. [py][mx]django课程页显示city和机构封面图

    city和课程机构信息展示到前台去 organization/views.py from django.views.generic.base import View from organization ...

  2. chrome正受到自动测试软件的控制-----web自动化测试如何去掉这段提示

    本文为原创文章 在web自动化测试的时候,特别是在用chrome浏览器的时候经常会出现 “chrome正受到自动测试软件的控制”  这样的一句提示, 这是因为安装chrome浏览器的时候没有设置允许调 ...

  3. EasyUI写的登录界面

    <!DOCTYPE html><html> <head>        <meta charset="utf-8" />       ...

  4. ExtJs中XTemplate使用(转)

    转自http://www.studyofnet.com/news/408.html 本文导读:XTemplate是Ext.Template扩展的新类,它支持高级功能的模板类,如自动数组输出.条件判断. ...

  5. webp格式

    有时候你右键保存了一张图片,然后好气啊,打不开.这要么是webp格式,要么,,,,要么有问题啊. WebP格式,谷歌大法开发的一种旨在加快图片加载速度的图片格式.图片压缩体积大约只有JPEG的2/3, ...

  6. HDU 2235

    这题说的是给了一个 平面 然后又很多的长方体柱子 问这个 容器的 容积是什么, 排序后 然后 进行 并查集 判断是否 可以有比他小的高度依靠他算体积,通过并查集去判断他的子集的个数. #include ...

  7. linux服务器---配置samba

    配置samba使用用户名和密码登录 1.当samba配置文件中的secure设置为user的时候,需要正确的用户名和密码才能登录. root@localhost /]#gedit /etc/samba ...

  8. HexDump.java解析,android 16进制转换

    HexDump.java解析android 16进制转换 package com.android.internal.util; public class HexDump { private final ...

  9. Secure CRT 自动记录日志log配置

    SecureCRT8.0的下载地址下载地址: 链接:https://pan.baidu.com/s/1i5q09qH 密码:4pa2 配置自动log操作如下: 1.options ---> Se ...

  10. mysql修改编码(数据库,表,字段)

    查看各个编码 //查看字段编码 SHOW FULL COLUMNS from park_car_user; //查看数据库字段SHOW CREATE DATABASE db_name; //查看表的编 ...