Redux 表单验证在加载时触发 (UPDATE_SYNC_ERRORS)

IT技术 reactjs redux-form
2021-05-13 03:54:38

所有必填字段的验证都由UPDATE_SYNC_ERRORS表单组件的加载触发我不认为这是一个错误,我认为这是一个代码问题(因为它曾经有效 - 尽管我最近更新了)

所以我的问题是 -UPDATE_SYNC_ERRORS在这个阶段有什么可能导致火灾?该字段也没有值 ( undefined) 但通过我的函数并在触摸字段时触发“必需”错误。

export const required = value => value ? undefined : 'Required';

我可以进行额外的检查,例如:value && value !== undefined ? undefined : 'Required';但是当 textField 被触摸时我没有收到错误。

任何想法如何在不完全剥离的情况下进行调试?干杯!

1个回答

在最后一天,我也遇到了这个问题,并努力寻找任何合适的解决方案,但是通过在 redux-form repo 上合并了许多不同的问题以及大量重新阅读文档并查看我的源代码得到了一些应该解决你的问题的东西。当然,差不多一年后,但希望它可以帮助某人。

注意: “魔法”是由注释表示的,因此如果您的 reduxForm 配置对象看起来不同,我不会太在意。

import { reduxForm, getFormValues, isDirty } from 'redux-form';

const formName = 'brilliantForm';

let MyForm = reduxForm({
    form: formName,
    enableReinitialize: true,
    asyncValidate,
    asyncBlurFields: [],
})(ComponentToWrap);

MyForm = connect(
    state => ({
        formValues: getFormValues(formName)(state),
        initialValues: {
            fieldOne: '',
            fieldTwo: '',
        },
        shouldValidate: () => isDirty(formName)(state), // This is the magic
    })
)(MyForm);

export default MyForm;

这里的要点是,如果您的表单有初始值,redux-form 将默认验证它们,除非您告诉它不要通过shouldValidate()isDirty选择使得限制验证,快速的工作之后,形式已经触碰/与之交互。

注意:7.1 开始, shouldValidate()已被拆分并弃用,以支持shouldError()shouldWarn()