React Native日期时间选择组件

本文原创首发于公众号：ReactNative开发圈，转载需注明出处。

React Native日期时间选择组件：react-native-datepicker，支持安卓和IOS双平台，支持单独选择日期、单独选择时间和选择日期和时间，支持自定义日期格式。

效果图

image

安装方法

npm install react-native-datepicker --save

示例代码

time: {this.state.time}
         {this.setState({datetime: datetime});}}
        />
        datetime: {this.state.datetime}
         {this.setState({datetime1: datetime});}}
        />
        datetime: {this.state.datetime1}

主要参数说明

date：设置初始显示的日期
mode：显示的模式，date,datetime,time
format：设置日期格式，默认为'YYYY-MM-DD'
confirmBtnText：确定按钮的显示名称
cancelBtnText：取消按钮的显示名称
minDate：显示的最小日期
maxDate：显示的最大日期
duration：时间间隔
onDateChange：日期变化时触发的事件
placeholder：占位符

完整示例

完整代码：GitHub - forrest23/ReactNativeComponents: React Native组件大全，介绍React Native常用组件的使用方法和使用示例
本次示例代码在 Component11文件夹中。请不要吝啬你们的Star！

组件地址

GitHub - xgfe/react-native-datepicker: react native datePicker component for both Android and IOS, useing DatePikcerAndroid, TimePickerAndroid and DatePickerIOS

微信不让跳转外链，可以点击查看原文来查看外链GitHub内容。

欢迎关注我的微信公众号：ReactNative开发圈

image