antd 弹框中的表单form 初始化问题

最新推荐文章于 2024-02-07 16:10:05 发布

apple_2021

最新推荐文章于 2024-02-07 16:10:05 发布

阅读量2k

点赞数

CC 4.0 BY-SA版权

分类专栏： # antd 文章标签： react.js javascript 前端

本文链接：https://blog.csdn.net/apple_2021/article/details/121425763

antd 专栏收录该内容

3 篇文章

订阅专栏

问题描述：

在公司做项目的时候，有一个关于表格中的编辑需求，我在弹框中用antd的表单组件，点开时，默认要显示目前行的相关数据。但是表单组件的initialValue只会渲染一次，这就导致我第二次点击编辑的时候还是第一次的数据。

代码如下：

<Modal
	title={modelTitle}
	centered
	visible={this.state.modal2Visible}
	onOk={() => this.addSubmit()}
	onCancel={() => this.setState({modal2Visible: false})}
>
	<Form
	  ref={this.formRef}
	  name="basic"
	  labelCol={{ span: 8 }}
	  wrapperCol={{ span: 16 }}
	  onFinish={this.onFinish}
	  onFinishFailed={this.onFinishFailed}
	>
	  <Form.Item
	    label="业务名称"
	    name="business_name"
	    initialValue={this.state.editNodeInf.business_name}
	    rules={[{ required: true, message: 'Please input business_name!' }]}
	  >
	    <Input />
	  </Form.Item>
	</Form>
</Modal>