Сравнение двух дат - дата окончания должна быть больше, чем дата начала при проверке в реактивном редуксе

Question

Я использую проверку даты, но она не работает для меня, потому что проверка даты выбирает блокировку моего календаря после выбора даты меньше, поэтому вы можете предложить мне, как решить эту проблему.

вот мой код:

index.js

import React from 'react';
import moment from 'moment';

const processDate = date =>
    date ? moment(date, date.length === 10 ? 'DD/MM/YYYY' : 
    null).format('MM/DD/YYYY') : null;
class Skills extends React.Component {
    static propTypes = {
        skills: PropTypes.array.isRequired,
    };
    onSubmitSkill(formData) {
        const { paramValue } = this.props;
        const skill = Object.assign({ employeeId: paramValue }, 
        formData);
        skill.startDate = processDate(skill.startDate);
        skill.endDate = processDate(skill.endDate);
    }
}

SkillsForm.js

import React, { Component } from 'react';
import { Input, DatePicker, Select } from 'components/Form';
import moment from 'moment';
import skillsValidations from './validations.js';

const selector = formValueSelector('academicYear');
const processDate = date => (date ? moment(date, date.length === 10 ? 'DD/MM/YYYY' : null) : null);

@connect(state => ({
    startDate: selector(state, 'startDate'),
    perm: state.auth.user.permissions,
}))
@reduxForm({
    form: 'skills',
    validate: skillsValidations,
})
export default class SkillsForm extends Component {
    constructor(props) {
        super(props);

        const defaultValues =
            (props.skill &&
                Object.assign(
                    {
                        startDate: processDate(props.skill.startDate),
                        endDate: processDate(props.skill.endDate),
                    },
                    props.skill,
                )) ||
            {};

        this.props.initialize(defaultValues);
    }

    render() {
       return (
            <form
                    <Field
                        component={DatePicker}
                        name="startDate"
                        label="Start Date"
                        placeholder="select date"
                        required
                    />
                    <Field
                        component={DatePicker}
                        label="End Date"
                        name="endDate"
                        placeholder="End Date"
                    />
            </form>
        );
    }
}

и это validations.js

import {
    createValidator,
    required,
    validDate,
} from 'utils/validation';
import moment from 'moment';

const skillsValidations = createValidator({
    startDate: [required, validDate],
    endDate: [validDate],
});

export default skillsValidations;

Я использую этокод, но он не работает для сравнения двух дат, в основном, конечная дата должна быть больше даты начала, я использую проверку даты, но она не работает для меня, потому что проверка DatePicker блокирует мой календарь после выбора меньше, чем дата, и календарь не работаеттогда я не выбираю какую-либо дату, тогда я должен изменить календарный месяц и выбрать дату, я не знаю, в чем проблема, я не знаю, в чем проблема, на самом деле, я использую реагирование 16, и я использую реагирование DatePicker версии 1.1.0 Я пробовал много логик между двумя датами сравнения, но нет логики.

Answer 1

Вы можете сделать простую вспомогательную функцию, которая проверяет дату проверки.

    checkDateValidation(startDate, endDate) {
        // check the dates
        if ((new Date(startDate) > new Date(endDate)) || (new Date(endDate) < new Date(startDate))) {
          // set date error validation true 
        } else {
          // null or false date error validation 
        }
      }