react-native的复选框实现

1,效果图:在这里插入图片描述
2,所需安装包:
npm install --save react-native-elements ;
3,引入:
import {TouchableOpacity } from ‘react-native’;
import { CheckBox } from ‘react-native-elements’;
4,使用元素:
由于使用第三方库react-native-elements会产生onpress事件无法触发的神奇现象,所以决定仅使用这个第三方库提供的左边图标,右边的文字则使用text,而他们俩的父元素则使用TouchableOpacity按钮。
5,实现思想:
点击按钮TouchableOpacity触发事件,将状态checked进行取反(true / false) ,checkbox的check状态取值为这个checked 值;
6,代码:

constructor (props){
super(props);
this.state={
checked: true,
}
}



onPress={( )=>this.setState({checked: !this.state.checked}) }>
自动登录

猜你喜欢

转载自blog.csdn.net/kalinux/article/details/88776884
今日推荐