我正在使用日期验证,但它对我不起作用,因为日期选择器验证在选择了小于日期后锁定了我的日历,所以请您建议我如何解决此问题。
这是我的代码:
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和我已经使用react datepicker版本1.1.0 我在两个日期之间进行了比较,但没有逻辑。
答案 0 :(得分:0)
您可以创建用于检查日期验证的简单帮助程序功能。
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
}
}