首页  >  问答  >  正文

使用useState设置表单内输入的值

<p>我正在尝试使用 useState 设置输入的值,但它无法按照我想要的方式工作。</p> <p>因此,我使用 Formik 创建了一个用于预约系统的每周时间表。我有免费预约的单选按钮。当选择时,我会获得约会的时间数据。但我没有得到这一天。所以我尝试添加另一个输入来获取日数据。我将输入的值设置为状态。当选择单选按钮时,它会设置日期。但是 onSubmit 我得到的是初始值,而不是新设置的值。有趣的是,当我尝试在输入中写入内容时,它会返回我想要的值+我按下的最后一个键。但如果我什么都不做,它只会返回初始值。</p> <p>我的表单的初始值:</p> <pre class="brush:php;toolbar:false;">const [day, setDay] = useState("Gün"); <Formik onSubmit={handleFormSubmit} initialValues={{ firstname: "", lastname: "", email: "", date: "", day: day, }} ></pre> <p>我设置状态的单选按钮:</p> <pre class="brush:php;toolbar:false;"><Field type="radio" name="date" value={x.monPm3Time} onClick={() => { setDay("Pazartesi"); }} /></pre> <p>我的输入的值设置为 state:</p> <pre class="brush:php;toolbar:false;"><Field id="day" name="day" value = {day} /></pre> <p>我的handleSubmit函数(我现在只是登录它们看看它是否有效):</p> <pre class="brush:php;toolbar:false;">const handleFormSubmit = async (values) => { console.log(values); // fetch("http://localhost:5000/api/appointment", { // method: "POST", // body: values, // headers: { // Authorization: "Bearer " + token, // }, // }) // .then((res) => { // console.log(res.status); // }) // .catch((err) => { // console.log(err); // }); }</pre></p>
P粉588660399P粉588660399384 天前515

全部回复(1)我来回复

  • P粉046878197

    P粉0468781972023-09-05 21:40:16

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

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

    回复
    0
  • 取消回复