Verwenden Sie useState, um den im Formular eingegebenen Wert festzulegen

Question

Ich versuche, useState zu verwenden, um den Wert einer Eingabe festzulegen, aber es funktioniert nicht so, wie ich es möchte.

Also habe ich mit Formik als Terminsystem einen Wochenplan erstellt. Ich habe einen Radiobutton für freie Termine. Bei Auswahl erhalte ich die Zeitdaten für den Termin. Aber ich habe diesen Tag nicht mitbekommen. Also habe ich versucht, einen weiteren Eingang hinzuzufügen, um tägliche Daten zu erhalten. Ich habe den eingegebenen Wert auf den Zustand gesetzt. Wenn das Optionsfeld ausgewählt ist, wird das Datum festgelegt. Aber onSubmit erhalte ich den Anfangswert statt des neu gesetzten Wertes. Wenn ich versuche, etwas in die Eingabe zu schreiben, wird interessanterweise der gewünschte Wert + die zuletzt gedrückte Taste zurückgegeben. Aber wenn ich nichts tue, wird nur der Anfangswert zurückgegeben.

Anfangswert meines Formulars:

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

<Formik
    onSubmit={handleFormSubmit}
    initialValues={{
    Vorname: "",
    Nachname: "",
    E-Mail: "",
    Datum: "",
    Tag Tag,
    }}
>

Ich habe den Status des Optionsfelds festgelegt:

<Feld
    type="Radio"
    name="Datum"
    value={x.monPm3Time}
    onClick={() =>
        setDay("Pazartesi");
    }}
/>

Der Wert meiner Eingabe wird auf den Status gesetzt:

<Feld
    id="Tag"
    name="Tag"
    Wert = {Tag}
/>

Meine handleSubmit-Funktion (ich protokolliere sie gerade, um zu sehen, ob sie funktioniert):

const handleFormSubmit = async (values) =>
        console.log(values);
        // fetch("http://localhost:5000/api/appointment", {
        // Methode: "POST",
        // Körper: Werte,
        // Header: {
        // Autorisierung: "Inhaber + Token,
        // },
        // })
        // .then((res) => {
        // console.log(res.status);
        // })
        // .catch((err) => {
        // console.log(err);
        // });
}

Answer 1

因此，我尝试在代码编辑器中复制（尽我所能）您的问题，并且当单击单选按钮时，我能够更改输入中的文本。您可以在这里找到我的实现： https://stackblitz.com/edit /react-b5rvzg?file=src%2FApp.js

我还相信您没有将任何内容传递给您的handleFormSubmit 函数，因此您不会看到任何内容。我可能是错的，因为我无法完全了解您的代码是如何设置的