react antd select组件的值如何修改
时间: 2023-05-20 09:05:15 浏览: 143
react使用antd表单赋值,用于修改弹框的操作
要修改 react antd select 组件的值,可以使用 onChange 事件来实现。具体代码如下:
```
import React, { useState } from 'react';
import { Select } from 'antd';
const { Option } = Select;
function handleChange(value) {
console.log(`selected ${value}`);
}
function App() {
const [value, setValue] = useState('jack');
function handleSelectChange(value) {
setValue(value);
}
return (
<Select value={value} onChange={handleSelectChange}>
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="disabled" disabled>
Disabled
</Option>
<Option value="Yiminghe">yiminghe</Option>
</Select>
);
}
export default App;
```
在上面的代码中,我们使用 useState 来定义一个 state 变量 value,然后在 handleSelectChange 函数中更新这个变量的值。最后将 value 作为 Select 组件的 value 属性传入即可。当用户选择不同的选项时,会触发 onChange 事件,从而调用 handleSelectChange 函数来更新 value 的值。
阅读全文