ReactJs - 格式化日期和時間

Question

我在這里使用了 react datepicker：https://www.npmjs.com/package/react-datepicker

我的領域是這樣的：

<DatePicker
    selected={this.state.startDate}
    onChange={this.handleChangeDate}
    dateFormat="yyyy-MM-dd"
/>

我的handle看起來像這樣：

handleChangeDate = date => {
    this.setState({
        startDate: date
    });
    console.log('Start Date:' + this.state.startDate)
    this.FormatDate()
};

選擇今天的日期時，我的handle中的控制台給了我這一點：

Mon Jun 29 2020 15:36:30 GMT-0700 (Pacific Daylight Time)

我在表單中的日期選擇器在保存表單時出於某種原因存儲如下：

2020-06-29T20:46:42Z

如何將startDate格式化為6/29/2020 3:45PM之類的格式。 我正在嘗試使用在這里找到的一個名為momentjs的庫： https://momentjs.com/ 。 如果有更好的方法，我不需要使用這個庫，但這是我目前所擁有的：

FormatDate() {
    console.log('In moment loop' + this.state.startDate);
    let FormatstartDate = moment(this.state.startDate).format("yyyy-MM-dd");
    console.log('Moment' + FormatstartDate);
}

Answer 1

從 react-datepicker git 存儲庫復制描述。 使用這個最新的 react-datepicker 來替換 momentjs。

回購鏈接： https://github.com/Hacker0x01/react-datepicker

直到版本 1.8.0，這個 package 使用 Moment.js。 從 v2.0.0 開始，我們切換到使用原生 Date 對象的 date-fns 來減小 package 的大小。 如果您從 1.8.0 切換到 2.0.0 或更高版本，請查看上面的更新示例，查看示例站點以獲取最新示例。

或者您可以直接使用 JavaScript 來執行此操作：

var ts = new Date("2020-06-29T20:46:42Z").toLocaleDateString('en-ca');

您也可以使用 ECMAInternationalAPI 來轉換日期時間格式。 如何格式化 JavaScript 日期