ReactNative

ReactNative-Switch开关组件

2021-02-22  本文已影响0人  Take_And_Give

简单介绍一下
Switch组件为跨平台组件Android IOS都可用

主要属性和方法:

disabled 属性 布尔值默认是false 设置是否可交互

onValueChange 方法 当值改变时调用

value 属性 设置开关状态默认是false关闭

onTintColor IOS属性 设置开启状态时的背景颜色

thumbTintColor IOS属性 设置圆形按钮背景颜色

tintColor IOS属性 设置关闭状态是的背景色

实例

import React, {Component} from  'react';
import {
    AppRegistry,
    Switch,
} from 'react-native';
class SwitchG extends Component {
    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {


            value: false


        };
    }


    render() {
        return (
            <Switch
                style={{marginTop: 120}}
                //动态改变value
                value={this.state.value}
                //当切换开关室回调此方法
                onValueChange={(value)=>{this.setState({value: value})}}
            />
        )
    }
}
module.exports = SwitchG;
上一篇 下一篇

猜你喜欢

热点阅读