第一次编辑时间：2018-06-11
编辑内容：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: '' //用来存取时间的
};
}
//你可能需要用到的方法：转换为时间戳
transitionTime = () => {
let strtime = this.state.date;
let date = new Date(strtime);
let time = date.valueOf();
console.log(this.state.date);//这里得到的时间格式是组件中定义的样式
console.log('转换后的时间戳是：' + 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: { //设置图标的位置
position: 'absolute',
left: 0,
top: 4,
marginLeft: 0
},
dateInput: {//
marginLeft: 36,
borderWidth: 0 //设置日期选择器的样式，这里可以去掉边框，这样看起来是不是更漂亮呢😊😯
}
}}
onDateChange={(date) => { this.setState({ date: date});}}
/>
来个截图：左边是控制台打印的数据(一个是date数据、一个是转换后的时间戳)，右边是组件的样式
图片中的时间选择器组件随便放的不要太在意……^ _ ^
来个漂亮点的截图....
哪位大神能帮我解答下：下面👇这两张图片如何并排显示呢？？？我是用的markdown编辑的看图
这两张图片如何并排显示呢？？？
image.png
image.png
下次来个日历组件...
其它：
React-Native之TextInput实现高度自增长解决方案
列表：react-native 开发过程中使用到的一些组件
-
react-native-image-picker
React Native的Picker组件，它模拟<select>iOS和Android 的本机界面 -
react-native-datepicker
日期📅选择器组件 -
flow
flow -
react-native-debugger
react-native-debugger 很好用的一个调试工具 -
react-native-vector-icons
React Native的自定义图标支持NavBar / TabBar / ToolbarAndroid -
react-native-splash-screen
启动页解决方案 v
