在 yup 条件下获取当前值

【问题标题】：get current value on yup when condition在 yup 条件下获取当前值
【发布时间】：2023-01-26 09:12:10
【问题描述】：

我有两个日期字段，开始日期和结束日期。我想知道如何设置验证以不接受开始日期早于结束日期，反之亦然。

阅读 yup 文档我看到了当条件，但它只是从其他字段获取值！

import { date, object } from 'yup';

export const yupSchema = object({
  startAt: date().typeError('Invalid date').nullable(),
  endAt: date().typeError('Invalid date').nullable(),
});

【问题讨论】：

标签： html reactjs validation react-hook-form yup

【解决方案1】：

您可以使用ref-不需要when。

示例代码：

const validationSchema = Yup.object().shape({
    arrivalDate: Yup.date().required(),
    departureDate: Yup.date().required().min(Yup.ref('arrivalDate'), 'Departure date must be after arrival date')})

上次我检查when 没有收到当前值，只有您正在检查的兄弟字段的值。请参阅 Github 上的this issue，其中有人提出了这个确切的问题。

【讨论】：

【解决方案2】：

您可以尝试此验证来比较这两个日期，

import * as Yup from 'yup';

export const yupSchema = Yup.object().shape({
  startAt: Yup.date().nullable(true).required('Start At is
  required.'),
  endAt: Yup.date()
    .nullable(true)
    .when(
      'startAt',
      (startAt, schema) =>
        startAt && schema.min(startAt, 'Start At should be later than End At')
    )
});

【讨论】：