Yup을 사용한 문자열 또는 숫자 길이 확인

Yup을 사용한 문자열 또는 숫자 길이 확인

특정 길이를 유효하게 하는 엽기능이 있나요?

는 는 i i는노노 i i i i i..min(5) ★★★★★★★★★★★★★★★★★」.max(5)단, 5글자(우편번호)로 되어 있는 것을 원합니다.

이 체크를 통해 최적의 검증 환경을 얻을 수 있습니다.

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

빌트인이라고는 생각하지 않지만, 다음과 같이 간단하게 실장할 수 있습니다.

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

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

나중에 참조할 수 있도록 번호(ZIP 코드)의 유효성을 확인하려면 위의 솔루션을 약간 수정해야 합니다.함수는 다음과 같습니다.

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

.length숫자에서는 동작하지 않고 문자열만 동작합니다.

를 사용할 수도 있습니다.

yup.string().length(5)

그러나 0으로 시작하는 숫자에서는 작동하지 않습니다.

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.

@Tamlyn의 답변은 질문의 길이 검증 측면을 잘 다루고 있다.

우편번호의 경우 regex를 사용하여 길이와 제한 값을 지정할 수 있습니다.Yup.string() 거예요.Yup.number()0으로 않기 때문에 합니다.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')

타입 번호의 부적처럼 기능합니다.

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

다른 답변에 덧붙이자면, 값이 존재하는지 확인하고 있는 것은 없습니다(이것을 투고하고 나서 코멘트에서 언급하고 있는 사람도 있습니다만).

않고 있는 , 이는 이 .undefined ★★★★★★★★★★★★★★★★★」null하고 javascript 오 음 음 음 음 음 음 음 음 음 른 른 른 른 른 른 른 른 which which which which as which which which which other other other other other other other which which which which which which which which which .required()(물론 셋업이 되어 있는 경우)를 사용할 수 없습니다.

이 방법이 약간 더 나을 수 있습니다.

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

이것을 시험해 보세요.

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

번호 검증을 사용할 수도 있지만 길이 검증을 위해 테스트를 사용할 경우 테스트 전에 문자열로 변환해야 합니다.

Yup.object().shape({
  zipCode: Yup.number()
    .required('Zip code is a required field')// optional
    .typeError('Zip code can only be a number')// optional as well
    .test('len', 'Zip code needs to be excatly 5 digits', val => val.toString().length === 5)
});

필드에 값이 없는 경우 테스트 API에 ReactJs 문제가 발생합니다.대신 길이 API를 사용할 수 있습니다.

Yup.string().length(4, 'This field has to be exactly 4 characters!')

matches(/^[0-9]{8}$/, "Only 8 digits") 이제 사용자가 문자를 8자리 이상 입력하면 Yup에 오류가 표시됩니다.

@efru의 답변은 22자 미만의 숫자에 적합합니다.하지만val.toString().length는, 22큰할 수 .그 이유는 javascript에서 큰 숫자를 문자열로 변환하면 지수 형식으로 변환되기 때문입니다.

가장 효과적인 솔루션은 다음과 같습니다.

Yup.number().test('len', '정확히 25자여야 합니다', val => Math.ceil(Math.log10(val + 1) === 25)

import { string, date} from 'yup' // Take out what is needed in import

string()
.trim()
.matches(
  /^[0-9]{4}[0-9]{2}[0-9]{2}T 0-9]{2}:[0-9]{2}:[0-9]{2}.[0-9]{3}Z$/,
  'createdOn is not in correct format',
)
.max(24),

내 번호를 문자열로 변환하고 리액트 상태의 번호를 문자열로 저장합니다.

나의 해결책은 이것이었다.

    amount: Yup.number()
      .test('len', maxAmountLength, () => amountState.length <= 50)

사용할 수 있습니다.typeError다음과 같습니다.

yup.number()
    .typeError('Must be only digits')
    .test('len', 'Must be exactly 5 characters', val => val.length === 5)

이것은 간단한 해결책이지만 완벽하지는 않다.

Yup.string()
.required()
.min(5, 'Must be exactly 5 digits')
.max(5, 'Must be exactly 5 digits')

솔루션 중 하나는 다음과 같습니다.

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

언급URL : https://stackoverflow.com/questions/49886881/validation-using-yup-to-check-string-or-number-length