当前位置: 首页 > 知识库问答 >
问题:

Reactjs钩子onChange与react-datepicker,无效的时间值错误

令狐翰
2023-03-14

我的新反应钩子,我试图将反应日期选择器从类转换为功能钩子。问题是当我触发onChange将显示(RangeError:无效的时间值),但默认选择的开始日期是渲染罚款。这能用钩子做吗?

 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;

我希望startDate状态在没有“RangeError:无效时间值”的情况下更改。

共有2个答案

苏健柏
2023-03-14

我已经在我的项目中使用它作为可重用的组件

    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),
鲁展
2023-03-14

问题在于,您不是在状态中插入日期,而是在对象中插入日期。

变化:

setStartDate({ startDate: date });

致:

setStartDate(date);
 类似资料:
  • 我试图创建一个React-datepicker;但是,我得到了这个错误: RangeError:无效的时间值 我添加了一个日期格式来匹配我的日期变量;然而,我仍然得到同样的错误? 我做错了什么? 我也尝试过dateFormat="MMMM d, yyyy h: mm aa"。

  • 我的日期选择器在尝试将从API获取的选定日期值设置为字符串值时抛出。 我的API日期字符串是 在反应2.0版本后,datepicker将不支持date作为字符串,它表示使用date-fns parseiso... 添加parseISO后,我仍然得到错误

  • 我为这个错误而发疯。。尝试了所有的解决方案,但没有任何效果。我正在显示材质ui日期选择器日历。直到今天,它一直工作得很好。我不知道发生了什么,我没有改变任何代码,甚至是我写的。 RangeError:无效的时间值 代码如下: “新日期()”正在返回 2019年8月16日星期五23:56:25 GMT 0300 有什么建议吗?

  • 我试图设置选定的参数作为默认日期的DatePicker的report-datepicker。基本上,我从数据库得到的日期是以下格式: 当我设置状态时,该日期以这种方式显示- 我尝试了将它转换成JavaScript兼容的日期。也尝试了MomentJS,但它也抛出了同样的错误。当我调用在参数,然后一切工作完美。我的意思是,DatePicker显示默认的今天日期。但是当我尝试将自定义日期值设置为Date

  • 我是一个很新的反应,并得到以下错误: 我想在提交表单时使用另一个组件。因此,在文件A中,当表单提交时,is使用一个函数,在调用其他组件之前首先检查某些内容,如: 在组件上,我有一些usstate钩子: 当页面正在加载的时候,我得到了这个错误,有没有人知道什么是错误的?

  • 我第一次面对的问题很小。我试图使用一个简单的useState,但出于某种原因,我不明白为什么React会给我一个错误,不管我想做什么--没有什么能修复它。 这是错误的图像:错误描述: 错误:无效的钩子调用。钩子只能在函数组件的主体内部调用。这可能是由于以下原因之一:1.React和呈现器(例如React DOM)2的版本可能不匹配。你可能违反了钩子3的规则。在同一个应用程序中可能有多个React副