赞
踩
问题:
modal关闭后form表单内数据未进行回收。导致组件再次打开后仍是关闭前的内容。
处理方法:
- const [createModalVisible, handleCreateModalVisible] = useState<boolean>(false);
- const layouts = {
- labelCol: { span: 4 },
- wrapperCol: { span: 16 },
- };
- <StepsForm
- stepsProps={{
- size: 'small',
- }}
- stepsFormRender={(dom, submitter) => {
- return (
- <Modal
- width={1000}
- bodyStyle={{
- padding: '32px 40px 48px',
- }}
- keyboard={false}
- maskClosable={false}
- destroyOnClose={true}
- title="新建规则"
- footer={submitter}
- open={createModalVisible}
- onCancel={() => {
- handleCreateModalVisible(false);
- }}
- >
- {dom}
- </Modal>
- );
- }}
- onFinish={async () => {
- message.success('提交成功');
- }}
- >
- <StepsForm.StepForm
- preserve={false}
- {...layouts}
- size="large"
- layout="horizontal"
- title="基本信息"
- >
- {...}
- </StepsForm.StepForm>
- <StepsForm>
Modal需设置destroyOnClose={true}
子组件form设置preserve={false}
Antd_Pro同样适用。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。