使用Yup验证字符串或数字长度

Question

是否有一个验证特定长度的yup函数？

我试过.min(5)和.max(5),但我想要的东西,保证数量正好是5个字符(即邮政编码).

Answer 1

此检查可带来最佳验证体验：

Yup.string()
.required()
.matches(/^[0-9]+$/, "Must be only digits")
.min(5, 'Must be exactly 5 digits')
.max(5, 'Must be exactly 5 digits')

输出：

12f1    // Must be only digits
123     // Must be exactly 5 digits
123456  // Must be exactly 5 digits
01234   // valid
11106   // valid

演示：https : //codesandbox.io/s/yup-y6uph

Answer 2

您也可以使用string.length.

yup.string().length(5)

但它不适用于以零开头的数字：

const yup = require('yup')

const schema = yup.string().length(5)

console.log(schema.isValidSync(12345)) // (true) This is valid.
console.log(schema.isValidSync(00123)) // (false) This is NOT valid.

Answer 3

@Tamlyn 的回答很好地涵盖了问题的长度验证方面。

在邮政编码的情况下，您可以使用正则表达式来强制长度和限制数字值Yup.string()（您不想使用Yup.number()类型，因为它不支持以零开头的邮政编码0####）

// ##### format zip code
Yup.string().matches(/^[0-9]{5}$/, 'Must be exactly 5 digits')

// ##### and #####-#### format zip codes
Yup.string().matches(/^[0-9]{5}(?:-[0-9]{4})?$/, 'Must be 5 or 9 digits')

Answer 4

我不认为内置任何东西,但它很容易实现test:

yup.string()
  .test('len', 'Must be exactly 5 characters', val => val.length === 5)

https://runkit.com/tamlyn/5ad9b99a4ba1230012d7ac21

Answer 5

供以后参考，如果您要验证数字（邮政编码），则上述解决方案需要稍作调整。该函数应为：

Yup.number().test('len', 'Must be exactly 5 characters', val => val.toString().length === 5)

.length 不适用于数字，仅适用于字符串。

Answer 6

就像类型号的魅力一样。

yup.number().test('len', 'Max 6 numbers', (val) => val.toString().length <= 6)

Answer 7

要添加到其他答案中，他们都没有检查值是否存在（我看到有些人在发布此内容后在评论中提到了这一点）...

如果它不存在并且该字段留空，它将尝试获取undefined或的长度，null然后会给您一个javascript错误并阻止其他条件，例如.required()工作（如果您像当然一样设置了它）。

这可能会稍微好一点：

// Check we have a value as well
Yup.number().test('len', 'Must be exactly 5 characters', val => val && val.toString().length === 5 )

Answer 8

尝试这个：

Yup.number()
.required()
.min(10000, 'Must be exactly 5 characters')
.max(99999, 'Must be exactly 5 characters')
.label("Zip Code"),