react-datepicker 不将 setState 设置为 dd/MM/yy

Question

日期以正确的格式 (31/08/21) 显示，但 onChange 将 startDate 设置为如下所示：

2021 年 8 月 31 日星期二 21:29:17 GMT+0200（Mitteleuropäische Sommerzeit）

如何保存我显示的格式？

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

export default function Bodyweight() {
  
const [startDate, setStartDate] = useState(new Date());

return(
<div>
  <DatePicker
          dateFormat="dd/MM/yy"
          selected={startDate}
          onChange={(date) => setStartDate(date)}
        />
</div>
)}

Answer 1

您的DatePicker组件接受Tue Aug 31 2021 21:29:17 GMT+0200 (Mitteleuropäische Sommerzeit)格式的日期。

它还以相同的格式返回日期。

为了将日期转换为所需格式，您有几个选择。

1. 如果 DatePicker 是您自己的组件，请检查其实现并修改代码，使其以所需格式返回日期。

2. 如果选项 1 不是一个选项，则手动将日期转换为所需格式。 请注意，您可能需要第三个变量来存储格式化日期，因为您的 DatePicker 组件接受实际日期 object 而不是字符串。

请参考此链接以请求格式转换日期。 格式 JavaScript 日期为 yyyy-mm-dd

Answer 2

只需在初始 state 集中使用new Date().toLocaleDateString()即可，即

const [startDate, setStartDate] = useState(new Date().toLocaleDateString());

我是根据我的理解来回答的，如果这不是你要找的解决方案，请在评论中纠正

Answer 3

派对有点晚了，但你可以试试这样的onChange={(date:Date) => setStartDate(date)}