从 React Datetime 中的日期数组中获取特定日期

Question

有谁知道我如何将一组日期传递给 react-datetime？我正在尝试实现一个日期选择器，它可以显示我所在州的“预订”日期，但目前我只设法禁用当前日期之前的所有日期。那么如何将我所在州的日期传递给<Datetime/>，以禁用它们？ 'use strict';import React       from 'react';import {PropTypes} from 'prop-types';import Datetime    from 'react-datetime';class DatePicker extends React.Component {    constructor(props) {        super(props);        this.state = {            dates: [{id: 1, date: 'Apr 30 2020 09:00:00 AM'}, {id: 2, date: 'May 1 2020 12:00:00 PM'}]        };    }    render() {        const {t} = this.props;        let yesterday = Datetime.moment().subtract(1, 'day');        let valid = function (current) {            return current.isAfter(yesterday);        };        return (            <div className="date-picker">                <p>{t('Date Picker')}</p>                <Datetime timeFormat={false} isValidDate={valid(yesterday)}/>            </div>        );    }}export default DatePicker;

Answer 1

首先，您的状态日期格式有问题。尝试使用时刻设置您的日期

this.state = {

   dates: [{

    id: 1,

    date: Datetime.moment("30 Apr 2020")

  },

  {

    id: 2,

    date: Datetime.moment("01 May 2020")

  }]

}

您的验证函数应该看起来像这样，或者您可以将其提取到类方法中

  let valid = function(current, selected) {

    return !this.state.dates.some(day => current.isSame(day.date, "day"));

  };

并将此函数传递给 Datetime

<Datetime timeFormat={false} isValidDate={valid}/>