J'ai une application développée avec React Native. J'utilise React-hook-form pour les écrans de connexion et d'inscription. J'ai un schéma de validation que j'ai créé. Je ne peux pas utiliser ce schéma de validation avec les règles du contrôleur React-Hook-Form car je ne peux pas attribuer la valeur d'entrée, aidez-moi s'il vous plaît !
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')}`; };
J'ai créé un exemple simple en utilisant React js au lieu de React Native (ce ne sera pas différent ici)
Bac à sableExemple ici