Question

我正在使用react-datetime-picker npm模块选择日期。我只需要显示日期而无需时间

import DatePicker from 'react-datetime-picker';
  
	onChange(date){
		this.setState({
			profileSetting:{dob:date}
		 });
		}

  <DatePicker className="form-control"
		disableClock={true}
		locale="en-US"
		onChange={this.onChange}
		value={this.state.profileSetting.dob}
		/>

当前日期显示为“ 10/20/2018 12:00 AM”，但我需要显示日期显示为“ 10/20/2018”。请帮我解决这个问题

Answer 1

在onChange方法中，您可以根据需要简单地设置日期格式

const selectedDate = new Date('10/20/2018 12:00 AM'); // pass in date param here
const formattedDate = `${selectedDate.getMonth()+1}/${selectedDate.getDate()}/${selectedDate.getFullYear()}`;
console.log(date);

Answer 2

您可以使用该代码定义格式和模式。第一种格式仅以“ YYYY-MM-DD”格式显示日期，第二种格式以“ YYYY-MM-DD hh：mm：ss”格式显示。使用的软件包：-从'react-native-datepicker'导入DatePicker

                   <DatePicker 
                    style={{ width: 200 }}
                    date={this.state.date}
                    placeholder="select date"
                    format="YYYY-MM-DD" 
                    //format='YYYY-MM-DD hh:mm:ss'
                    minDate="2016-06-01"
                    maxDate="2020-06-01"
                    confirmBtnText="Confirm"
                    cancelBtnText="Cancel"
                    mode='datetime'
                    customStyles={{
                        dateIcon: {
                            position: 'absolute',
                            left: 0,
                            top: 4,
                            marginLeft: 0
                        },
                        dateInput: {
                            marginLeft: 36
                        }
                    }}
                    onDateChange={(date) => {
                        this.setState({ date: date })
                    }}
                />

如何在react-datetime-picker中显示唯一的日期

2 个答案: