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

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

相關文章

最新評論