Formulaire React Hook et validation ouais : méthode de validation de formulaire efficace

Question

J'ai créé un composant Acheter maintenant pour mon site Web de commerce électronique React JS. Le problème auquel je suis confronté est que la validation du formulaire n'est pas terminée. J'ai utilisé un analyseur mais il n'a toujours pas validé mon formulaire.这是我的代码：

importer React, { useEffect, useState } depuis 'react'
importer "./e.css"
importer { useForm } depuis "react-hook-form" ;
importer { yupResolver } depuis "@hookform/resolvers/yup"
importer * comme ouais depuis "oui"

fonction d'exportation par défaut BuyNow (accessoires) {
    const [pays, setCountry] = useState([])
    useEffect(() => {

        const getcountry = async () => {
            const res = wait fetch("http://localhost:3000/setpk.json")
            const getcon = attendre res.json()

            setCountry (attendre getcon)
        }
        obtenirpays()

    }, [])


    schéma const = ouais.object({
        nom complet : ouais.string().required(),
        email : ouais.string().email().required(),
        adresse : ouais.string().required(),
        phoneno : ouais.number().required().integer().min(11),
        ville : ouais.string().required(),
        paiement : ouais.string().required()

    })
    const {register, handleSubmit, watch, formState : { erreurs } } = useForm({
        résolveur : yupResolver (schéma)
    });

    const onSubmit = (données) => {

        console.log(données)

    }



    retour (



        ≪>
            

                
立即购买
                

                    


                        

                        


                        
                        
                        

                            --城市名称--
                            {
                                country.map((countryget, i) => (
                                    {countryget.city}
                                ))
                            }


                        
                        

                            

                                 --付款方式-- 
                                信用卡
                                货到付款
                                银行转账
                            
                            
                        

                        {/* Continuer ➔ */}

                    
                    
                    
            



            


                
总价

                
${props.totalprice}



            


        ≪/>
    )
}
            

Answer 1

J'ai résolu ce problème en remplaçant yup.integer() par yup.string()

phoneno : yup.number().required().integer().min(11),