只贴部分代码
onBlur: handleTrim('testifyOrderReceiveInfo','email'),
form的结构是
{
testifyOrderReceiveInfo: { email: '' }
}
表单绑定字段时,这么写name={['testifyOrderReceiveInfo', 'email']}
就可以获得结构化的form表单对象
const renderElectronicFields = useCallback(
() => (
<ProFormText
name={['testifyOrderReceiveInfo', 'email']}
label="电子邮箱"
rules={[
validationRules.required('请输入电子邮箱'),
validationRules.maxLength(64, '电子邮箱最多64个字'),
validationRules.email,
]}
fieldProps={{
onBlur: handleTrim('testifyOrderReceiveInfo','email'),
}}
/>
),
[handleTrim],
);
// Trim 函数
const handleTrim = useCallback(
(fieldName: any, subFieldName) => (e: React.FocusEvent<HTMLInputElement>) => {
if(!fieldName) return
const value = e.target.value.trim();
const obj = form.getFieldsValue([fieldName]);
const aimObj = obj[fieldName];
if (!aimObj) return;
aimObj[subFieldName] = value;
form.setFieldsValue({
[fieldName]: aimObj, // 使用动态键名
});
},
[form],
);