第一次編輯時間：2018-06-11
編輯內(nèi)容：react-native 日期??選擇器的使用
使用的庫：https://github.com/xgfe/react-native-datepicker
安裝： npm install react-native-datepicker --save
引入： import DatePicker from 'react-native-datepicker';
使用：
constructor(props){
super(props);
this.state = {
date: '' //用來存取時間的
};
}
//你可能需要用到的方法：轉(zhuǎn)換為時間戳
transitionTime = () => {
let strtime = this.state.date;
let date = new Date(strtime);
let time = date.valueOf();
console.log(this.state.date);//這里得到的時間格式是組件中定義的樣式
console.log('轉(zhuǎn)換后的時間戳是：' + time);
};
//這是組件插入到你想要放置的地方
<DatePicker
style={{width: 200}}
date={this.state.date}
mode='datetime'
placeholder='請選擇時間'
format='YYYY-MM-DD hh:mm' //這里定義時間的樣式
// format='YYYY-MM-DD HH:mm' //??????如果想使用24小時的時間制度這里的hh要使用大寫的HH....哈哈哈
confirmBtnText='確定'
cancelBtnText='取消'
customStyles={{//
dateIcon: { //設(shè)置圖標(biāo)的位置
position: 'absolute',
left: 0,
top: 4,
marginLeft: 0
},
dateInput: {//
marginLeft: 36,
borderWidth: 0 //設(shè)置日期選擇器的樣式挨务，這里可以去掉邊框啤它，這樣看起來是不是更漂亮呢????
}
}}
onDateChange={(date) => { this.setState({ date: date});}}
/>
來個截圖：左邊是控制臺打印的數(shù)據(jù)(一個是date數(shù)據(jù)碰缔、一個是轉(zhuǎn)換后的時間戳)考余，右邊是組件的樣式
圖片中的時間選擇器組件隨便放的不要太在意……^?_?^
來個漂亮點(diǎn)的截圖....
哪位大神能幫我解答下：下面??這兩張圖片如何并排顯示呢羔挡？？愕秫？我是用的markdown編輯的看圖
這兩張圖片如何并排顯示呢承疲？？冲呢？
image.png
image.png
下次來個日歷組件...
其它：
React-Native之TextInput實現(xiàn)高度自增長解決方案
列表：react-native 開發(fā)過程中使用到的一些組件
-
react-native-image-picker
React Native的Picker組件舍败，它模擬<select>iOS和Android 的本機(jī)界面 -
react-native-datepicker
日期??選擇器組件 -
flow
flow -
react-native-debugger
react-native-debugger 很好用的一個調(diào)試工具 -
react-native-vector-icons
React Native的自定義圖標(biāo)支持NavBar / TabBar / ToolbarAndroid -
react-native-splash-screen
啟動頁解決方案 v
