React Native를 사용하여 개발한 앱이 있습니다. 로그인 및 등록 화면에 React-hook-form을 사용하고 있습니다. 내가 만든 유효성 검사 스키마가 있습니다. 입력 값을 할당할 수 없기 때문에 React-Hook-Form 컨트롤러 규칙과 함께 이 유효성 검사 체계를 사용할 수 없습니다. 도와주세요!
const formKeys = { email: 'email', password: 'password', }; const { handleSubmit, control, formState: {errors}, } = useForm(); <Controller control={control} name={formKeys.email} render={({field: {onChange, value}}) => ( <InputFields errorMessage={errors[formKeys.email]?.message.toString()} value={value} onChangeText={onChange} autoCapitalize={'none'} placeholder={t('common:email')} image={ <View style={styles.userIconsStyle}> <EmailIcon/> </View> } /> )} rules={{ required: emailValidation() //input value required here, minLength: minLengthValidation(validationSchema.email.minLength), maxLength:maxLengthValidation(validationSchema.email.maxLength), }} /> /*validation schema*/ export const emailValidation = (v: string): boolean | string => { const {t,i18n}=useTranslation(); const emailRegx = /^[a-zA-Z0-9]+@[a-zA-Z0-9]+\.[A-Za-z]+$/; if (v) { return emailRegx.test(v) || `${t('common:errorMessages:invalidEmailAddress')}`; } else return `${t('common:email')} ${t('common:errorMessages:isRequired')}`; };
P粉8113290342024-03-27 11:04:11
React Native 대신 React js를 사용하여 간단한 예제를 만들었습니다. (여기서도 다르지 않습니다.)
으아악샌드박스예제