我是反应钩子的新手,我试图将反应日期选择器从类转换为带有钩子的函数。问题是当我触发onChange将显示(范围错误:无效的时间值(时,但默认的"选定"开始日期呈现正常。这可以用钩子完成吗?
import React, { useState, Fragment } from 'react';
import Datepicker from 'react-datepicker';
const Example = () => {
const [startDate, setStartDate] = useState(new Date());
const handleChange = date => {
setStartDate({ startDate: date });
}
return (
<Fragment>
<Datepicker
selected={startDate}
onChange={handleChange}
/>
</Fragment>
)
}
export default Example;
我希望在没有"范围错误:无效的时间值"的情况下更改开始日期状态。
问题是您不是在状态中插入日期,而是在插入对象。
改变:
setStartDate({ startDate: date });
自:
setStartDate(date);
我已经在我的项目中将其用作可重用组件
return (
<DatePicker
fixedHeight
showFullMonthYearPicker
showDisabledMonthNavigation
selected={selectedDate}
value={valueDate}
onChange={(day) => onChange && onChange(day, flag)}
className="react-datepicker__input-container-days"
/>
);
};
这是我调用我的组件的地方
{renderDateDay({
flag: 0,
valueDate: manuFucturedValue.day,
selectedDate:
(manuFucturedValue.day &&
new Date(manuFucturedValue.day)) ||
null,
onChange: (day) =>
handleDateOnchange(day, "day", 0),