react antd 组件取值的方法

在React中使用Ant Design（antd）组件，可以通过不同的方式获取组件的值，具体取决于所使用的Ant Design组件和其相关的API。

一般来说，大部分Ant Design组件都有value属性或onChange事件，可用于获取或监听组件的值。以下是几个常见的Ant Design组件的取值方法示例：

1、Input 输入框组件：

　　使用value属性获取输入框的值：

import { Input } from 'antd';

function MyComponent() {
  const [inputValue, setInputValue] = useState('');

  const handleInputChange = (e) => {
    setInputValue(e.target.value);
  };

  return (
    <Input value={inputValue} onChange={handleInputChange} />
  );
}

　　使用onChange事件获取输入框的值：

import { Input } from 'antd';

function MyComponent() {
  const handleInputChange = (e) => {
    const value = e.target.value;
    // 处理输入框的值
  };

  return (
    <Input onChange={handleInputChange} />
  );
}

2、Select 选择器组件：

　　使用value属性获取选择器的值：

import { Select } from 'antd';

function MyComponent() {
  const [selectedValue, setSelectedValue] = useState('');

  const handleSelectChange = (value) => {
    setSelectedValue(value);
  };

  return (
    <Select value={selectedValue} onChange={handleSelectChange}>
      {/* 选项列表 */}
    </Select>
  );
}

　　使用onChange事件获取选择器的值：

import { Select } from 'antd';

function MyComponent() {
  const handleSelectChange = (value) => {
    // 处理选择器的值
  };

  return (
    <Select onChange={handleSelectChange}>
      {/* 选项列表 */}
    </Select>
  );
}

　　以上示例中，通过使用value属性或onChange事件，可以获取或监听Ant Design组件的值。具体取决于所用组件的API和业务需求，您可以选择适合您的方式来获取组件的值。