import React, { useState } from 'react';
import { Select } from 'antd';
const { Option } = Select;
const App = () => {
const [value, setValue] = useState(undefined);
const onChange = (newValue) => {
console.log('Selected value:', newValue);
setValue(newValue);
};
const onClear = () => {
console.log('Select cleared');
setValue(undefined);
};
return (
<Select
value={value}
onChange={onChange}
onClear={onClear}
allowClear
>
<Option value="option1">Option 1</Option>
<Option value="option2">Option 2</Option>
<Option value="option3">Option 3</Option>
</Select>
);
};
export default App;
当用户选择一个选项时,onChange会被触发,并且新值会被记录和使用。当用户点击清除按钮时,onClear会被触发,并且value会被重置,清除时也会触发onChange事件,因此也可以在onChange事件中对newValue做判断,newValue为undefined时,进行特殊的赋值。