CODEWITHSUNDEEP
reactjsreact-reduxredux-form
Meesam
Meesam

Reputation: 109

Editing a form is not working on react redux

I am new on react. I am working on react application with redux. I have a form (I am using redux-form) by which I can save data or edit data. my problem is , In edit mode I populate data using componentWillReceiveProps. and populated perfectly, now when I try to clear any field on form its again fill.

componentWillReceiveProps(nextProps){
    this.props.dispatch(initialize('NewProject', nextProps.project.project[0]));
  }

I would be grateful for any help.

Upvotes: 0

Views: 464

Answers (1)

Justin K
Justin K

Reputation: 239

Is there a reason you're not dispatching this action somewhere else, like in componentDidMount? I can't say without seeing more code, but it's possible that whenever you edit your form, React again calls componentWillReceiveProps and overwrites whatever you did with the behavior you've given your component.

Per the React documentation:

Note that React may call this method even if the props have not changed, so make sure to compare the current and next values if you only want to handle changes. This may occur when the parent component causes your component to re-render.

It may be a good idea for you to move your dispatch to a more predictable event if possible, like componentDidMount. Typically, your render method should be capable of handling different cases if a component has multiple possible states. You could also create an edit and save version of your component, and render one or the other based on the props you receive. The best way to "populate" data, as you put it, is to define propTypes for your component, and then use your props to insert that data into elements in the render method.

Upvotes: 2

Related Questions