首页 文章

Redux-form onChange在表单上没有正确触发

提问于
浏览 次
1

我正在使用reduxForm .

我创建了组件

<form>
    <Field name="example" component="SomeCustomInputComponent" type="text"/>
</form>

我使用onChange函数将整个组件应用于reduxForm：

export default reduxForm({
    form: 'settingsAuthorization',
    destroyOnUnmount: false,
    forceUnregisterOnUnmount: true,
    enableReinitialize: true,
    onChange: (value, dispatch, props) => {
        console.warn(value);
    }
})(component);

在给出一些值之后，我对onChane的行为没有做任何事情 .

最有趣的是我尝试调试我的onChange函数的用法，我注意到：Debbug IMG

这里nextProps.values与this.props.values相同 . 当我更改表单上的内容时也是如此 . nextProps和this.props的值 . 如初始化 .

但是在redux devtool网站上，我获得了有关已调度的redux-form / CHANGE操作的信息：

@@ redux-form.CHANGE

我可以看到表单值在全局存储（store.form.form_name.values.name）中更改：

form - > form_name - > values - > name：'old Name'=>'new Name'

当我把：

onChange: (value, dispatch, props) => {
        console.warn(value);
    }

我在我的网站上的其他形式的 property 一切顺利 .

我如何通过使用react-redux来修复我的第一个对变更事件的反应？

javascript react-redux redux-form

1 回答

  • 0

    您需要将表单reducer添加到redux reducer中，以便在redux存储中存储和更新表单状态 . 有关如何执行此操作的文档here

    如果你不是't using redux for anything else, you' ll需要 createStore ，并将你的应用程序包装在react-redux Provider 中，更多关于here

    回复于

相关问题