Yup日期验证，结束日期必须在开始日期之后。

Question

这是我的代码，我正在尝试强制两个日期字段始终不同，结束日期必须至少比开始日期晚一天。

const EditSchema = Yup.object().shape({

       StartDate: Yup.date()
      .transform(value => (isDate(value) ? undefined : value))
      .typeError('Enter a start date')
      .required('Enter a start date'),

       EndDate: Yup.date()
      .min(Yup.ref('StartDate'), 'End date must be after start date')
      .transform(value => (isDate(value) ? undefined : value))
      .typeError('Enter an end date')
      .required('Enter an end date')
});

- Gustavo Borges

---

我认为你需要禁用之前选择的日期。 - Samira

如果您分享您的表单，可能会帮助其他人。 - Samira

Answer 1

经过几个小时尝试，这是代码。

当您有日期选择器并选择日期时，它将类似于“01/01/2021 00:00:00”。

因此，如果您需要结束日期至少在开始日期之后一天，您必须在开始日期上添加1小时，这将不允许您放置2个相等的日期。

   StartDate: Yup.date()
      .transform(value => (isDate(value) ? undefined : value))
      .typeError('Enter a date')
      .required('Enter a date')
      ),
      EndDate: Yup.date()
      .min(Yup.ref('StartDate'), 'End date must be after start date')
      .when('StartDate', (st, schema) => {
      
        if(st != null){
          st.setHours(st.getHours() + 1);
          return schema.min(st)

        //this else prevents your page from crashing if there's any other input
        
         }else
          return schema.min('1900-01-01')

      })
      .transform(value => (isDate(value) ? undefined : value))
      .typeError('Enter a date')
      .required('Enter a date')
  });

- Gustavo Borges

---

目前你的回答不够清晰，请编辑并添加更多细节，以帮助其他人理解它如何回答问题。你可以在帮助中心找到有关如何撰写好答案的更多信息。 - Jmaurier