pro-components icon indicating copy to clipboard operation
pro-components copied to clipboard

🐛[BUG] validateTrigger="onBlur" validation not working

Open Ladvace opened this issue 1 year ago • 4 comments

I tried to apply a validateTrigger="onBlur" on a ProForm.Item but the validation doesn't seems working, I'm using it on a stepForm

Ladvace avatar May 03 '24 09:05 Ladvace

以下的 Issues 可能会帮助到你 / The following issues may help you

  • [#8006][🐛[BUG]Table.EXPAND_COLUMN not working][60%]

github-actions[bot] avatar May 03 '24 09:05 github-actions[bot]

validateTrigger 为 onBlur没生效的原因找到了。因为源码中有一个WithValueFomFiledProps组件分隔了form.item和表单组件间的props传递。其中有一个判断 const isProFormComponent = // @ts-ignore filedChildren?.type?.displayName !== 'ProFormComponent'; 如果为false的话会导致很多props不会透传给antd的form.item。这个干嘛用的不太清楚。 所以解决方案可以是给自己自定义的组件加上 displayName ="ProFormComponent" 属性就能解决。 不过这个应该不是最终解决方案,还是得看它原来是要干嘛 @chenshuai2144

SANmq avatar May 18 '24 03:05 SANmq

重新看了一下就是onBlur没有传进去,跟isProFormComponent无关。 const { children: filedChildren, onChange, onBlur, ignoreFormItem, valuePropName = 'value', ...restProps } = formFieldProps; omitUndefined({ ...restProps, [valuePropName]: formFieldProps[valuePropName], ...filedChildren.props, onChange: finalChange, fieldProps, })

就是restProps中没有onBlur了,所以没有透传给proformItem下的组件

SANmq avatar May 18 '24 05:05 SANmq

在使用 2.7 版本的时候,发现是可以的 当在rules中设置时,无法触发校验,如下: <ProFormText rules={[ { required: true, validator: validatorFunc, validateTrigger: "onBlur" }, ]} /> 当validateTrigger属性放在ProFormText中时,触发可以生效 <ProFormText validateTrigger="onBlur" rules={[ { required: true, validator: validatorFunc }, ]} /> 官方文档中也是如此设置,希望有帮助!

taajason avatar May 21 '24 09:05 taajason