Yup验证：验证表单字段是否以另一个输入字段的值开头

Question

我的表单中有两个字段，分别为carriercode和billnum。我需要验证数字始终应该具有以carriercode为前缀的值，例如如果carriercode=ABCD，则blnum应为ABCD后跟任何字符，可以是字符串或数字。

return Yup.object({
    carriercode: Yup.string().required(requiredMessage).min(4,"length should be 4").matches(/^[a-zA-Z0-9-]+$/,"Can not contain special characters like ),(,@ etc."),
    blnum: Yup.string().required(requiredMessage) //validate if blnum starts with carriercode
     
  })
}

有没有办法使用 yup 验证实现这一点，简单来说，我需要像 yup 中的 startsWith/indexOf 功能一样的东西。

- Hema

Answer 1

test方法可以是其中之一。在test方法内，您可以使用this.parent ['carriercode']访问其他字段（此处为carriercode）。只需像这样创建自定义验证器：

Yup.object({
    carriercode: Yup.string().required(requiredMessage).min(4, "length should be 4").matches(/^[a-zA-Z0-9-]+$/, "Can not contain special characters like ),(,@ etc."),
    blnum: Yup.string()
        .required("Should be the prefix of carriercode") //validate if blnum starts with carriercode
        .test("Check prefix", function () {
            let carriercode = this.parent["carriercode"];
            let blnum = this.parent["blnum"];
            // console.log(carriercode, blnum);
            if (carriercode && blnum) {
                return blnum.startsWith(carriercode) ? true : false;
            }
        })
})

- Shahnawaz Hossan

---

@Hema，我的荣幸 :) - Shahnawaz Hossan