相关疑难解决方法(0)

Redux表单 - initialValues不用状态更新

我在使用redux-form设置初始表单字段值时遇到了一些问题.

我正在使用redux-form v6.0.0-rc.3并对v15.3.0做出反应.

所以这是我的问题,我有一个用户网格,当点击用户行时,我正在导航到编辑用户页面并在网址中包含用户ID.然后在编辑用户页面上,我抓住id并调用fetchUser(this.props.params.id),这是一个返回this.state.users的动作创建者.然后,我试图通过调用以下方式设置表单初始值:

function mapStateToProps(state) {
    return { initialValues:  state.users.user }
}
Run Code Online (Sandbox Code Playgroud)

根据我的理解,这应该将initialValues设置为state.users.user,并且每当更新此状态时,也应该更新initialValues.对我来说情况并非如此.InitialValues被设置为先前单击的用户行(即this.state.users.user的先前状态).所以我决定测试这个并向这个组件添加一个按钮,当它被点击时,我再次使用硬编码的用户ID调用fetchUser:

this.props.fetchUser('75e585aa-480b-496a-b852-82a541aa0ca3');

这是正确更新状态,但initialValues的值不会更改.更新状态时不会更新.我在旧版本的redux-form上测试了这个完全相同的过程,它按预期工作.

我在这里做错了什么,或者这是我正在使用的版本的问题.

用户编辑表格 -

class UsersShowForm extends Component {

    componentWillMount() {
        this.props.fetchUser(this.props.params.id);
    }

    onSubmit(props){
        console.log('submitting');
    }

    changeUser() {
        this.props.fetchUser('75e585aa-480b-496a-b852-82a541aa0ca3');
    }

    renderTextField(field) {
        return (
      <TextField 
        floatingLabelText={field.input.label}
        errorText={field.touched && field.error}
        fullWidth={true}
        {...field.input}
      />)
    }

    render() {
        const { handleSubmit, submitting, pristine } = this.props;

        return(

            <div>
                <form onSubmit={handleSubmit(this.onSubmit.bind(this))} className="mdl-cell mdl-cell--12-col">

                    <Field name="emailAddress" component={this.renderTextField} label="Email Address"/>

                    <Field name="firstName" component={this.renderTextField} label="First Name"/>

                    <Field name="lastName" component={this.renderTextField} label="Last Name"/>
                </form> …
Run Code Online (Sandbox Code Playgroud)

reactjs redux redux-form react-redux

19
推荐指数
2
解决办法
1万
查看次数

标签 统计

react-redux ×1

reactjs ×1

redux ×1

redux-form ×1