Reactjs 日期范围验证-开始日期不能与jquense/yup中的结束日期相同
我在reactjs中使用Yup进行表单验证。我的表单有两个日期,Reactjs 日期范围验证-开始日期不能与jquense/yup中的结束日期相同,reactjs,validation,yup,Reactjs,Validation,Yup,我在reactjs中使用Yup进行表单验证。我的表单有两个日期,startDate和endDate。我已经成功地实现了范围验证。但在我的场景中,startDate必须大于endDate(不应等于)。但下面的模式只检查endDate的小于方案。因为它接受相同的日期。请帮忙 我使用的模式是: schema = Yup.object().shape({ startDate: Yup.date().min(new Date(), 'Please choose future date').type
startDate
和endDate
。我已经成功地实现了范围验证。但在我的场景中,startDate必须大于endDate(不应等于)。但下面的模式只检查endDate的小于方案。因为它接受相同的日期。请帮忙
我使用的模式是:
schema = Yup.object().shape({
startDate: Yup.date().min(new Date(), 'Please choose future date').typeError('Start Date is Required'),
endDate: Yup.date().min(Yup.ref('startDate'), 'End date must be grater than start date').typeError('End Date is Required'),
});
我知道为时已晚,但我在发布此答案,如果有帮助,我找到了以下解决方案:
schema = Yup.object().shape({
startDate: yup
.date()
.required("Start Date is Required"),
endDate: yup
.date()
.min(
yup.ref("startDate"),
"End date must be grater than start date"
)
.test({
name: "same",
exclusive: false,
params: {},
message: "End date must be grater than start date",
test: function(value) {
const startDate = moment(this.parent.startDate).format("YYYY-MM-DD")
const endDate = moment(value).format("YYYY-MM-DD")
return !moment(startDate).isSame(moment(endDate))
},
}),
});
我还没有测试上面的代码,但它似乎取决于另一个第三方库
moment
,对此我将不胜感激。我们可以使用本机javascript日期方法执行相同的操作。