Question

APi向我返回以下日期：

const date = "2019-06-3021:59:59.999+00";

当我尝试以编辑形式将其放入selected时：

  <DatePicker
     selected={date}
     onChange={this.props.handleChangeDateTask}
     showTimeSelect
     timeFormat="HH:mm"
     timeIntervals={15}
     dateFormat="MMMM d, yyyy h:mm aa"
     timeCaption="time"
   />

返回错误invalid time。如何将其转换为React Date Picker使用的格式？我尝试了new Date (date)，但没有用。

Answer 1

日期不是任何有效格式，因为它在某些部分之间包含空格。可以使用以下方法解决此问题：

render(){
  const date = "2019-06-30 21: 59: 59.999 + 00"
  const formattedDate = new Date(date.replace(/: /g, ':',).replace(/ \+ /g, '+'));

  return <DatePicker
     selected={formattedDate}
     onChange={this.props.handleChangeDateTask}
     showTimeSelect
     timeFormat="HH:mm"
     timeIntervals={15}
     dateFormat="MMMM d, yyyy h:mm aa"
     timeCaption="time"
   />
}

Answer 2

做到这一点非常容易。解析日期看起来像这样

let date = "2019-06-30T21:59:59.999+00";

您可以这样做：

date = date.substring(0, 10) + "T" + date.substring(10, date.length);

然后解析该日期并将其传递给DatePicker：

return <DatePicker
     selected={moment(date).toDate()}
     onChange={this.props.handleChangeDateTask}
     showTimeSelect
     timeFormat="HH:mm"
     timeIntervals={15}
     dateFormat="MMMM d, yyyy h:mm aa"
     timeCaption="time"
   />

将服务器返回的日期转换为React Date Picker使用的格式

2 个答案: