我有一个验证模式(validationSchema),如果用户选择了一个特定时间段之前的日期,就会显示错误。然而,当用户通过Yup接收到错误时,它会显示如下内容。这不是我想要的,因为我需要让用户理解问题。
然而,我希望日期以用户能够理解的方式进行格式化,例如只显示日期而不是完整的时间和毫秒。以下是我的代码。
const validationSchema = Yup.object({
contractOptionToExtend: Yup.number('Option to Extend').required().min(0),
originalEndDate: Yup.date().required().min(Yup.ref('startDate')),
startDate: contract.leadContract && contract.leadContract.startDate ? Yup.date().min(contract.leadContract.startDate) : Yup.date(),
ultimateEndDate: Yup.date().min(Yup.ref('currentEndDate')),
currentEndDate: Yup.date().min(Yup.ref('originalEndDate'))
});
const initialValues = {
contractOptionToExtend: contract && contract.contractOptionToExtendId || -1,
originalEndDate: contract && contract.originalEndDate,
startDate: contract && contract.startDate,
ultimateEndDate: contract && contract.ultimateEndDate,
currentEndDate: contract && contract.currentEndDate
};
我的日期选择器组件
<DatePicker
margin="normal"
format="d MMM yyyy"
label="Original End Date"
value={values.originalEndDate}
onChange={handleOriginalEndDateChange}
onBlurCapture={change.bind(null, 'originalEndDate')}
required
id="originalEndDate"
name="originalEndDate"
autoOk={true}
error={touched.originalEndDate && Boolean(errors.originalEndDate)}
helperText={touched.originalEndDate ? errors.originalEndDate : ''}
/>
Orginal End Date cannot be a date before ${(min)}
) 仍然给出了一个很长的日期,有没有办法缩短它? - Broken MindformatDate
函数来实现这个目的。例如,你可以使用${new Date(min).toDateString()}
或${new Date(min).toLocaleDateString()}
。 - Raicuparta