如何以redux格式重置初始值

Sun*_* tc 18 reactjs redux redux-form

我正在使用redux-form.我在州的输入字段中显示初始值.当我单击重置时,输入字段仍显示初始值.

如何重置输入字段?

这是我的代码:

const mapStateToProps = (state) => {
    return {
        initialValues: {
            name:state.userInfo.data.name,
            email:state.userInfo.data.email,
            phone:state.userInfo.data.phone,
            city:state.userInfo.data.city.name,
        }
    };
}
Run Code Online (Sandbox Code Playgroud)

这就是我在输入字段中调用初始值的方法.

const renderField = ({ input, label, type, meta: { touched, error } }) => (
    <div>
        <input className="form-control control_new" {...input} placeholder={label} type={type}/>
    {touched && ((error && <span>{error}</span>))}
    </div>
)

<Field type="text" {...name} name="name" component={renderField} label="Enter Your Name" />
Run Code Online (Sandbox Code Playgroud)

谢谢

Har*_*a W 18

import {reset} from 'redux-form';

...

dispatch(reset('myForm'));  // requires form name
Run Code Online (Sandbox Code Playgroud)

  • 这是最新版本的正确答案 (2认同)

Eri*_* R. 16

Harsha的答案是正确的,但你也可以this.props.reset()从你的装饰表单组件中调用已经知道你的表单名称.

您可以在简单示例中的"清除值"按钮上查看它.

  • 如果传递`initialValues`,这似乎不起作用.表单保留旧的initialValues,然后切换到新的. (4认同)

Joh*_*per 15

TLDR:enableReinitialize: true在您的表单上设置

我最近遇到了同样的问题并遇到了这篇文章,没有任何答案有效.终于找到了解决方案,希望这对其他人有帮助.问题是重置表单时没有重置的初始值.这是一个询问它的github问题,这是关于它的当前文档

  • 赞美你,先生.夸你. (2认同)