如何设置 a-select 的默认选中项

在使用 Ant Design 的 a-select 组件时，可以通过设置 defaultValue 或 value 属性来设置默认选中项。

1. 使用 defaultValue 属性

defaultValue 属性用于设置初始默认值，它在组件第一次渲染时生效。

import { Select } from 'antd';

const options = [
  { value: 'option1', label: 'Option 1' },
  { value: 'option2', label: 'Option 2' },
  { value: 'option3', label: 'Option 3' },
];

const App = () => {
  return (
    <Select defaultValue='option2' options={options} />
  );
};

ReactDOM.render(<App />, mountNode);

2. 使用 value 属性

value 属性用于设置当前选中的值，它会根据组件状态的变化而更新。

import { Select, useState } from 'antd';

const options = [
  { value: 'option1', label: 'Option 1' },
  { value: 'option2', label: 'Option 2' },
  { value: 'option3', label: 'Option 3' },
];

const App = () => {
  const [value, setValue] = useState('option2');
  return (
    <Select value={value} options={options} onChange={setValue} />
  );
};

ReactDOM.render(<App />, mountNode);

注意：

• defaultValue 属性仅在组件第一次渲染时生效，之后的状态变化需要使用 value 属性进行控制。
• 如果 defaultValue 和 value 属性同时存在，value 属性的优先级更高。
• value 属性需要与 options 中的 value 属性保持一致。

希望以上内容能帮助您更好地使用 Ant Design 的 a-select 组件。