antd form表单select设置初始值怎样操作?select设置初始值的操作还是比较简单的,大家直接看代码吧。另外,本文给还给大家分享了解决antd 表单获取不到默认值的问题,感兴趣的朋友就继续往下看吧。
<Form.Item label="作用对象"> {getFieldDecorator('targetId', { initialValue: this.state.targetId }, { rules: [{ required: false, message: '作用对象' }] })( <Select placeholder="请选择作用对象"> {targetList.map(entity => <Option key={entity.id} value={entity.id}>{entity.name}</Option>)} </Select> )} </Form.Item>
在getFieldDecorator('targetId',时添加初始值而不是在select标签中添加初始值
补充知识:解决antd 表单获取不到默认值的问题
使用 antd 的 4.x 版本,给表单设置初始值,但是获取不到值
如果需要设置默认值并展示到页面上,需要设置两个地方:
设置 defaultValue,这个是用来展示在页面上的,例如:
<Form.Item label="Sex" name="sex" valuePropName="checked"> //这里的defaultValue <Radio.Group defaultValue={1}> <Radio value={1}>男</Radio> <Radio value={0}>女</Radio> </Radio.Group> </Form.Item>
设置 initialValues,这个是用来获取表单值的,例如:
<Form
name="basic"
onFinish={this.onFinish}
onFinishFailed={this.onFinishFailed}
initialValues={{
sex: 1
}}
>
<Form.Item label="Sex" name="sex" valuePropName="checked">
<Radio.Group defaultValue={1}>
<Radio value={1}>男</Radio>
<Radio value={0}>女</Radio>
</Radio.Group>
</Form.Item>
<Form.Item {...tailLayout}>
<Button type="primary" htmlType="submit">
register
</Button>
</Form.Item>
</Form>
关于antd form表单select设置初始值的操作就介绍到这,本文代码有一定的借鉴价值,感兴趣的朋友可以参考,希望能对大家有帮助,想要了解更多antd form表单的内容,大家可以关注其它的相关文章。
文本转载自脚本之家
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
长按识别二维码并关注微信
更方便到期提醒、手机管理