如何在 React 中更新 ANTD 文本输入字段（如 getElementById）

Question

我需要像这样更新简单文本输入字段的等效方法

document.getElementById("myid").value = "sample input"

使用 React 钩子，文本字段是 Antd 控件。

我的代码无效：

import { Input } from "antd"
import { useRef } from "react";

export default function App() {
  const inputRef = useRef();

  const myfunction = () => {
    inputRef.current = "sample input"
  }

  return (
    <div>
      <button onClick={myfunction} >populate textbox</button>
      <p/>
      <Input ref={inputRef} />
    </div>
  );
}

Answer 1

您可以尝试此代码并阅读 React 的文档。并且仔细看看你在antd中拿的组件的属性；

const [value, setValue] = useState('');
const myfunction = () => {
 setValue('Text')
}
return (
<>
<button onClick={myfunction} >populate textbox</button>
<Input value={value}>
</>
)

如何在 React 中更新 ANTD 文本输入字段（如 getElementById）

How to update ANTD text input field in React (like getElementById)

reactjs

antd