a-select defaultValue="默认选项">
2、设置value属性
a-select value="默认选项">
3、通过option的key属性设置默认选项
a-select>
const options = [ { value: '1', label: '默认值1' }, { value: '2', label: '默认值2' }, { value: '3', label: '默认值3' }, ]; a-select defaultValue="1" options={options}>
在上述例子中，我们通过定义一个options数组，在数组元素中定义了value和label两个属性，分别对应选项的值和显示的文本。这样，当我们设置defaultValue为"1"时，a-select便会默认选中"value"值为"1"的选项。
在getFieldDecorator方法中，我们通过配置initialValue属性来设置a-select的默认值。当我们在表单提交的时候，getFieldValue方法便可以获取到当前选中的值。
import React, { useState } from 'react'; import { Select } from 'antd'; function MyComponent(props) { const [defaultValue, setDefaultValue] = useState('1'); function handleChange(value) { setDefaultValue(value); } return ( ); }
在上述例子中，我们通过useState Hook来创建一个名为defaultValue的状态变量，并将初始值设置为"1"。当用户选择其他选项时，handleChange函数会触发并更新defaultValue状态变量，从而实现动态的默认值设置。
import React, { Component } from 'react'; import { Select } from 'antd'; import { connect } from 'react-redux'; class MyComponent extends Component { handleChange = (value) => { const { dispatch } = this.props; dispatch({ type: 'updateDefaultValue', payload: value, }); } render() { const { defaultValue } = this.props; return ( ); } } function mapStateToProps(state) { const { defaultValue } = state; return { defaultValue, }; } export default connect(mapStateToProps)(MyComponent);
在上述例子中，我们首先使用connect方法连接MyComponent组件和redux的store。然后，通过mapStateToProps方法将store中的defaultValue属性映射到MyComponent组件的props属性中。在handleChange方法中，我们通过dispatch方法派发一个type为"updateDefaultValue"的action，payload为用户选择的value值，从而触发store中的reducer更新defaultValue属性。最后，我们使用Select组件来展示选项列表，并设置defaultValue属性为props中的defaultValue属性。
京公网安备 11010802030320号