Javascript 用秒来响应日期选择器时间选择
我还需要从react date picker中选择秒数。我已经检查过了医生们发现的这个 在这个解决方案中,我可以从中选择小时、分钟、上午/下午,但没有秒选项。有任何自定义方法也可以从中选择秒。下面的示例需要帮助 我尝试过改变日期格式 dateFormat=“MM/dd/yyyy h:MM:ss aa”不工作Javascript 用秒来响应日期选择器时间选择,javascript,material-ui,react-datepicker,Javascript,Material Ui,React Datepicker,我还需要从react date picker中选择秒数。我已经检查过了医生们发现的这个 在这个解决方案中,我可以从中选择小时、分钟、上午/下午,但没有秒选项。有任何自定义方法也可以从中选择秒。下面的示例需要帮助 我尝试过改变日期格式 dateFormat=“MM/dd/yyyy h:MM:ss aa”不工作 () => { const [startDate, setStartDate] = useState(new Date()); return ( <DatePic
() => {
const [startDate, setStartDate] = useState(new Date());
return (
<DatePicker
selected={startDate}
onChange={date => setStartDate(date)}
timeInputLabel="Time:"
dateFormat="MM/dd/yyyy h:mm aa"
showTimeInput
/>
);
};
()=>{
const[startDate,setStartDate]=useState(新日期());
返回(
设置开始日期(日期)}
timeInputLabel=“时间:”
dateFormat=“MM/dd/yyyy h:MM aa”
显示时间输入
/>
);
};
我找到了显示秒数的方法,但效果很好,但是在我们选择时间后,整个对话框关闭,在模型内部。我正在使用这个内部材质对话框
() => {
const [startDate, setStartDate] = useState(new Date());
const ExampleCustomTimeInput = ({ value, onChange }) => (
<input
type="time"
step="1"
value={value}
onChange={e => onChange(e.target.value)}
style={{ border: "solid 1px pink" }}
/>
);
return (
<DatePicker
selected={startDate}
onChange={date => setStartDate(date)}
showTimeInput
customTimeInput={<ExampleCustomTimeInput />}
/>
);
};
()=>{
const[startDate,setStartDate]=useState(新日期());
const ExampleCustomTimeInput=({value,onChange})=>(
onChange(e.target.value)}
样式={{边框:“实心1px粉红色”}
/>
);
返回(
设置开始日期(日期)}
显示时间输入
customTimeInput={}
/>
);
};
您可以在其中使用customTimeInput
属性和路径ownonChange
功能:
customTimeInput={
<CustomTimeInput
onChangeCustom={this.handleChangeTime}
/>
}
谢谢我也在找同样的
const CustomTimeInput = ({ date, onChangeCustom}) => {
const value = date instanceof Date && !isNaN(date)
? // Getting time from Date beacuse `value` comes here without seconds
date.toLocaleTimeString('it-IT')
: '';
return (
<input
className="bp3-input bp3-fill"
type="time"
step="1"
value={value}
onChange={(event) => onChangeCustom(date, event.target.value)}
/>);
};
handleChangeTime = (date, time) => {
const [hh, mm, ss] = time.split(':');
const targetDate = date instanceof Date && !isNaN(date) ? date : new Date();
targetDate.setHours(Number(hh) || 0, Number(mm) || 0, Number(ss) || 0);
this.handleDateChange(targetDate);
};