Utilisez useState pour définir la valeur saisie dans le formulaire

Question

J'essaie d'utiliser useState pour définir la valeur d'une entrée, mais cela ne fonctionne pas comme je le souhaite.

J'ai donc créé un planning hebdomadaire en utilisant Formik pour un système de rendez-vous. J'ai un bouton radio pour les rendez-vous gratuits. Une fois sélectionné, j'obtiens les données horaires du rendez-vous. Mais je n'ai pas eu ce jour. J'ai donc essayé d'ajouter une autre entrée pour obtenir des données quotidiennes. J'ai défini la valeur saisie sur l'état. Lorsque le bouton radio est sélectionné, il définit la date. Mais lors de la soumission, j'obtiens la valeur initiale au lieu de la valeur nouvellement définie. Fait intéressant, lorsque j'essaie d'écrire quelque chose dans l'entrée, cela renvoie la valeur souhaitée + la dernière touche sur laquelle j'ai appuyé. Mais si je ne fais rien, cela renvoie simplement la valeur initiale.

Valeur initiale de mon formulaire :

const [day, setDay] = useState("Gün");

<Formik
    onSubmit={handleFormSubmit}
    valeursinitiales={{
    prénom : "",
    nom : "",
    email : "",
    date : "",
    jour : jour,
    }}
>≪/pré>
<p>Je règle l'état du bouton radio : </p>
<pre class="brush:php;toolbar:false;"><Champ
    tapez="radio"
    nom="date"
    valeur={x.monPm3Time}
    onClick={() =>
        setDay("Pazartesi");
    }}
/></pré>
<p>La valeur de mon entrée est définie sur l'état :</p>
<pre class="brush:php;toolbar:false;"><Champ
    id="jour"
    nom="jour"
    valeur = {jour}
/></pré>
<p>Ma fonction handleSubmit (je suis juste en train de les enregistrer maintenant pour voir si cela fonctionne) : </p>
<pre class="brush:php;toolbar:false;">const handleFormSubmit = async (valeurs) =>
        console.log(valeurs);
        // récupérer("http://localhost:5000/api/appointment", {
        // méthode : "POST",
        // corps : valeurs,
        // en-têtes : {
        // Autorisation : "Porteur" + jeton,
        // },
        // })
        // .then((res) => {
        // console.log(res.status);
        // })
        // .catch((erreur) => {
        // console.log(err);
        // });
}

Answer 1

J'ai donc essayé de reproduire (au mieux de mes capacités) votre question dans l'éditeur de code et j'ai pu modifier le texte dans l'entrée lorsque vous cliquez sur le bouton radio. Vous pouvez trouver mon implémentation ici : https://stackblitz.com/edit /react-b5rvzg?file=src%2FApp.js

Je pense également que vous ne transmettez rien à votre fonction handleFormSubmit, vous ne verrez donc rien. Je peux me tromper car je ne comprends pas bien comment votre code est configuré