加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

React-native 之Picker的使用

发布时间:2020-12-15 08:23:53 所属栏目:百科 来源:网络整理
导读:本系列教程是学习东方耀老师的课程中按照教程写的课堂笔记,基础控件的使用其实与 Android 及 iOS 类似,并没有太大的区别,因此此处只记录代码,不做更多分析,等后期项目实战阶段再详细分析。 效果图如下: 代码index.ios.js import React,{Component} fro

本系列教程是学习东方耀老师的课程中按照教程写的课堂笔记,基础控件的使用其实与AndroidiOS类似,并没有太大的区别,因此此处只记录代码,不做更多分析,等后期项目实战阶段再详细分析。

效果图如下:



代码index.ios.js


import React,{Component} from 'react'; import { AppRegistry,StyleSheet,Text,View,Image,PiexRatio,TouchableOpacity,Picker,} from 'react-native'; class ReactDemo extends Component { constructor(props) { super(props); this.state = { language:null }; } render() { return ( <View style={[styles.flex,{marginTop:45}]}> <Text>Picker组件</Text> <Picker selectedValue={this.state.language} onValueChange={lang => this.setState({language:lang})} mode="dialog" style={{color:'#f00'}} > <Picker.Item label="Java" value="Java"/> <Picker.Item label="JavaScript" value="js"/> <Picker.Item label="C语音" value="c"/> <Picker.Item label="PHP开发" value="php"/> </Picker> <Text>{this.state.language}</Text> </View> ); } } AppRegistry.registerComponent('ReactDemo',() => ReactDemo);

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读