react-native-datepicker
日期选择框
-
安装
yarn add react-native-datepicker
-
引入
import DatePicker from 'react-native-datepicker';
-
使用
const dateNow=new Date(); const currentDate = `${dateNow.getFullYear()}-${dateNow.getMonth() + 1}-${dateNow.getDate()}`; <DatePicker // 输入框的样式 style={{ width: Styleskits.screen.width - 50 }} mode="date" placeholder="设置生日" format="YYYY-MM-DD" // 选择日期后的确定取消文本按钮 confirmBtnText="确定" cancelBtnText="取消" iconComponent={<Icon name="angle-down" />} // 默认是方框选择的样式,这个是滚轮滚动的样式 androidMode="spinner" minDate="1900-01-01" maxDate={currentDate} customStyles={{ dateIcon: { // 表示不需要那个小日历图标 display: "none" }, // 输入框的样式 dateInput: { borderWidth: 0, borderBottomWidth: 1.1, // 里面的文字从左边开始显示 alignItems:"flex-start", paddingLeft:6, textAlign:"left" }, // 输入框里面的文字样式 placeholderText:{ fontSize:18, color:"#afafaf" } }} onDateChange={(date) => { this.setState({ birthday: date }) }} />