React Native控件之Switch与Picker组件讲解

React Native控件之Switch与Picker组件讲解

（一）前言

这篇文章主要介绍两个简单的组件Switch与Picker组件，这两个组件在实际开发中也是经常用到的。接下来我们来介绍一下这两个控件。

（二）Switch组件

2.1 Switch组件是Android与iOS平台通用组件，用于开/关两种状态的选择组件。
2.2 Switch属性方法

1. View相关样式属性都别继承过来
2. disabled bool 如果赋值为true，用户就无法点击switch开关控件，默认是false
3. onValueChange function 当组件状态值发生变化的时候回调
4. value bool 该开关的值，如果为true呈打开状态，反之为关闭状态。

上面是通用平台所属属性，以下是iOS平台专有属性。
1. onTintColor color，开关开启状态背景颜色。
2. thumbTintColor color，Switch原型把手颜色
3. tintColor color 开关关闭状态背景颜色

官方例子如下：

var PerfectProject = React.createClass({
    getInitialState () {
     return {
       trueSwitchIsOn: true,
       falseSwitchIsOn: false,
      }
   },
   render: function(){
    return(  
      <View style={styles.container}>
              <Text>Switch实例</Text>
              <Switch style={
  {
  marginTop:10, marginBottom:10, backgroundColor:'transparent'}} 
                      value={
  this.state.trueSwitchIsOn}
                      onValueChange={ (value) => this.setState({
  trueSwitchIsOn:value}) }
                      onTintColor='red'
                      thumbTintColor='green'
                      tintColor='