pro-components
pro-components copied to clipboard
🧐[问题]ModalForm 关闭时 onOpenChange 触发2次 open 都是fasle
🧐 问题描述
ModalForm onOpenChange function在关闭时候被触发2次,打开的时候触发1次,关闭时触发2次的open都是false。求解惑
💻 示例代码
<ModalForm
open={open}
title={'测试'}
form={form}
autoFocusFirstInput
width={500}
onOpenChange={(open) => {
console.log('open', open);//关闭时候2次都是false
setOpen(false)
}}
modalProps={{ destroyOnClose: true, forceRender: false, }}
submitter={{
render: (props, defaultDoms) => {
return [
<Button key="extra-reset" onClick={() => {
props.reset();
}} > 重置 </Button>,
...defaultDoms,
];
},
}}
onFinish={async (values) => {
return true;
}}
autoComplete="off"
>
</ModalForm>
@chenshuai2144 应该是onFinish触发了一次 setOpen(false)又触发了一次,
搞个 pr 吧,做个判断。而且没不影响。
Hello @YuShai. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!
你好 @YuShai,我们完全同意你的提议/反馈,欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请务必提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等,并确保 CI 通过,我们会尽快进行 Review,提前感谢和期待您的贡献。
搞个公关吧,做个判断。而且没影响。
试了,还是存在一点影响的,我没有去使用onOpenChange
@chenshuai2144应该是onFinish触发了一次setOpen(false)又触发了一次,
onFinish我没有去return true; 取消了使用onOpenChange 使用了onCancel,就正常了
绕开了 也不是啥好办法
今天在查询Redux Actions时偶然发现了onOpenChange
为false时会触发两次Action,起初以为是代码哪块重复调用了,仔细检查确实没有重复调用; 研究发现是组件本身在trigger={undefined}
回传了两次 onOpenChange(false)
:
https://github.com/ant-design/pro-components/blob/master/packages/form/src/layouts/ModalForm/index.tsx#L97-L250
对于为何在传入trigger
时,onOpenChange 即会恢复正常,本人功力尚浅,百思不得其解,盲猜涉及到了状态更新机制
我觉得最简单的修复方法就是修改 afterClose
: open && setOpen(false);
我也遇到了相似的问题,但是为什么在我的 Case 中表现是 open 为 true 时触发两次,为false时触发1次,求大佬们解惑