欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

React Native日期時間選擇組件的示例代碼

 更新時間:2018年04月27日 11:30:29   作者:ReactNative開發(fā)圈  
本篇文章主要介紹了React Native日期時間選擇組件的示例代碼,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧

React Native日期時間選擇組件:react-native-datepicker,支持安卓和IOS雙平臺,支持單獨選擇日期、單獨選擇時間和選擇日期和時間,支持自定義日期格式。

效果圖

安裝方法

npm install react-native-datepicker --save

示例代碼

<Text style={styles.instructions}>time: {this.state.time}</Text>
    <DatePicker
     style={{width: 200}}
     date={this.state.datetime}
     mode="datetime"
     format="YYYY-MM-DD HH:mm"
     confirmBtnText="確定"
     cancelBtnText="取消"
     showIcon={false}
     onDateChange={(datetime) => {this.setState({datetime: datetime});}}
    />
    <Text style={styles.instructions}>datetime: {this.state.datetime}</Text>
    <DatePicker
     style={{width: 200}}
     date={this.state.datetime1}
     mode="datetime"
     format="YYYY-MM-DD HH:mm"
     confirmBtnText="確定"
     cancelBtnText="取消"
     customStyles={{
      dateIcon: {
       position: 'absolute',
       left: 0,
       top: 4,
       marginLeft: 0
      },
      dateInput: {
       marginLeft: 36
      }
     }}
     minuteInterval={10}
     onDateChange={(datetime) => {this.setState({datetime1: datetime});}}
    />
    <Text style={styles.instructions}>datetime: {this.state.datetime1}</Text>

主要參數(shù)說明

date:設(shè)置初始顯示的日期 mode:顯示的模式,date,datetime,time format:設(shè)置日期格式,默認為'YYYY-MM-DD' confirmBtnText:確定按鈕的顯示名稱 cancelBtnText:取消按鈕的顯示名稱 minDate:顯示的最小日期 maxDate:顯示的最大日期 duration:時間間隔 onDateChange:日期變化時觸發(fā)的事件 placeholder:占位符

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評論