时间戳格式不支持 React `react-datepicker` 作为默认值

Question

我的 api 结果的日期时间格式是 2019-12-30T06:16:48.453Z。 react-datepicker 不支持它。

我的代码如下，是一个功能组件。下面我没有写完整的代码。仅添加了必需的部分。

import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";

<DatePicker
    selected={'2019-12-30T06:16:48.453Z'}
    {...props}
/>

我也尝试通过导入添加 moment 并用作 selected={moment('2019-12-30T06:16:48.453Z')}

我在这两种情况下都遇到了错误，例如 Maximum update depth exceeded。

Answer 1

Maximum update depth exceeded

当渲染方法 return 中的函数调用超出限制时，会发生此错误。你能检查你的组件内的任何其他函数调用吗？

并且

react-datepicker

尝试基本 JavaScript 日期 api。

selected={new Date('2019-12-30T06:16:48.453Z')}

这应该有效

Answer 2

他们还在使用 moment 的 react datepicker 版本 1.8，以减少他们使用本机日期对象的包大小。 reference

因此您可以更新您的代码，如下所示

 function App() {
  return (
    <div className="App">
      <DatePicker selected={new Date("2019-12-30")} />
      <DatePicker selected={new Date("2019-12-30T06:16:48.453Z")} />
    </div>
  );
}

工作codesandbox

更新

要获得所需的格式，React datepicker 有一个名为 dateFormat 的道具，因此您可以像这样添加 dateFormat="dd/MM/yyyy"，参见 here

Answer 3

 const datee='2019-12-30T06:16:48.453Z';
 let filt = Date(datee);
 console.log(filt);
 document.write(filt);

Answer 4

这个关于无限循环的错误。你可以检查这个问题：您还可以在 DatePicker 组件中设置 dateFormat，例如：dateFormat="MMMM d, yyyy h:mm aa" 检查格式：https://reactdatepicker.com/

时间戳格式不支持 React `react-datepicker` 作为默认值

Timestamp format is not supporting the React `react-datepicker` as default value

reactjs

react-datepicker