Preventing infinite loops - only call update callback when form value actually changed

Author: davidkpiano

examples/quick-start/components/user-form.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Form, actions, Control, Field, Errors } from 'react-redux-form';
+import { LocalForm, Form, actions, Control, Field, Errors } from 'react-redux-form';
 import { connect } from 'react-redux';
 
 const required = (val) => !!(val && val.length);
@@ -37,6 +37,12 @@ class UserForm extends React.Component {
   render() {
     const { forms: { user }, dispatch } = this.props;
 
+    return (
+      <LocalForm onSubmit={v=>console.log(v)}>
+        <Control.text model=".username" />
+      </LocalForm>
+    )
+
     return (
       <Form model="user" onSubmit={this.handleSubmit.bind(this)}>
         <div>

src/components/form-component.js

@@ -85,9 +85,12 @@ function createFormClass(s = defaultStrategy) {
     }
 
     componentDidUpdate(prevProps) {
-      this.handleUpdate();
       this.handleIntents();
 
+      if (!shallowEqual(prevProps.formValue, this.props.formValue)) {
+        this.handleUpdate();
+      }
+
       if (!shallowEqual(prevProps.modelValue, this.props.modelValue)) {
         this.handleChange();
       }