VeeValidate v4&yupで日付のバリデーションをかける

VeeValidate v4の必須じゃない日付で、
date()を使ったときにハマったときの備忘録。。

---

date().nullable()だと空文字でエラーが出てしまう。。
transform()で処理する必要があるっぽい

• jquense/yup: Dead simple Object schema validation

使い方

const { meta, values, errors, handleSubmit, resetForm } = useForm<FormDataType>({
  validationSchema: computed(() => object({
    name: string().required(),
    date: date().nullable().transform((value, originalValue, _ctx) =>
      // 入力された値が空文字だったらnullを返すようにtransform
      !!originalValue ? value : null)
  })),
  initialValues: ref({
    name: "",
    date: null,
  })
});

参考ンにしたサイト様

• jquense/yup: Dead simple Object schema validation
• VeeValidate: Painless Vue.js forms
• compositionAPIでyupとvee-validateを使ったバリデーションをする