【问题标题】:React input value doesnt work with states反应输入值不适用于状态
【发布时间】:2021-08-09 14:30:06
【问题描述】:

我有奇怪的错误。当我尝试用一​​个状态改变我的输入值时它不起作用但是如果我把我的状态写在一些空的地方所以它开始改变值。为什么会这样?我的代码:

  <Form
    className="mt-4"
    layout="vertical"
    requiredMark="hidden"
    name="basic"
    form={form}
    onFinish={onFinish}
    onFinishFailed={onFinishFailed}
  >
    <Form.Item
      name="Name"
      label="Başlık"
      style={{ width: 400 }}
      rules={[{ required: true, message: "Lütfen Başlık Giriniz!" }]}
    >
      <Input
        id="IDTitle"
        placeholder="Başlık"
        onChange={handleInputChange}
      />
    </Form.Item>
    <Form.Item name="Url" label="URL" style={{ width: 400 }}>
{titleData} // if i write it its working. But if i delete that row its not shows or update value.
      <Input placeholder="Url" disabled value={titleData}></Input>
    </Form.Item>
     
     
      <Button
        type="primary"
        className="submitButton float-right"
        htmlType="submit"
      >
        Submit
      </Button>
    </Form.Item>
  </Form>

const handleInputChange = (e) => {
    const data = e.target.value;
    console.log(data);
    setTitleData(toEnglishChar(data));
  };

我该如何解决?感谢所有回复!我不知道为什么会这样,但我尝试了我能做的一切。我也尝试使用默认输入更改 antd 输入,但它也不起作用。谢谢大家的回复!!

【问题讨论】:

  • 这段代码 sn-p 看起来不完整。请发布所有相关代码。也请适当地标记。这是 React、Angular 或 Vue,不是全部 3
  • 它的反应项目与 Ant Design 组件。我现在将编辑我的代码 1 分钟。感谢您的警告。
  • 请分享整个组件代码
  • @User10 我编辑我的代码。
  • @BoussadjraBrahim 我编辑我的代码。

标签: javascript reactjs antd


【解决方案1】:

更改onChange 事件如下:

<Input
  id="IDTitle"
  placeholder="Başlık"
  onChange={e => handleInputChange(e)}
/>

【讨论】:

  • 谢谢大哥回复!但它仍然是相同的结果。如果我的状态无效,它不会更新。
猜你喜欢
  • 2021-12-30
  • 2020-01-26
  • 1970-01-01
  • 2016-04-25
  • 2018-10-03
  • 1970-01-01
  • 2021-11-27
  • 2021-08-10
  • 1970-01-01
相关资源
最近更新 更多