Reactjs Hook onChange with react-datepicker,无效的时间值错误



我是反应钩子的新手,我试图将反应日期选择器从类转换为带有钩子的函数。问题是当我触发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),

相关内容

  • 没有找到相关文章