javascript - Load Data Asynchronously not working using redux-form -


i trying load data form asynchronously using redux-form v6.7.0, not working. referred link. below sample code. appreciated. in advance.

/* reducers should maintain immutability */    var personinfo = {    name: "",    age: ""  };    function personinforeducer(state = personinfo, action) {    switch (action.type) {      case "save_person_data":        return object.assign({}, state, action.payload);  default:        return state;    }  }    /* save person data action */  var savepersondata = (data) => {    return {      type: "save_person_data",      payload: data    };  };    /* form sample component */  class formsample extends react.component {    componentdidmount() {      const { initialize, savepersondata } = this.props;        settimeout(() => {        var personinfo = {          name: "abraham",          age: 21        };        savepersondata(personinfo);      }, 3000);      }      componentwillreceiveprops(nextprops) {      //console.log(nextprops);      //debugger;      //this.props.change("personname", nextprops.personinfo.name);      //this.props.change("personage", nextprops.personinfo.age);    }      render() {      return (        <form>          <reduxform.field name={"personname"} component="input" type="text" />          <reduxform.field name={"personage"} component="input" type="text" />          <h4>values: </h4>{json.stringify(this.props.personinfo)}        </form>      );    }  }    formsample = reduxform.reduxform({      form: 'formsample', // unique identifier form  })(formsample);    function mapstatetoprops(state) {    const { personinfo } = state;      return {      initialvalues: personinfo,      personinfo: personinfo    };  }    function mapdispatchtoprops(dispatch) {    return redux.bindactioncreators({      savepersondata    }, dispatch);  }    formsample = reactredux.connect(mapstatetoprops, mapdispatchtoprops)(formsample);      const allreducers = redux.combinereducers({    personinfo: personinforeducer,    form: reduxform.reducer  });    const store = redux.createstore(allreducers);    reactdom.render(<reactredux.provider store={store}><formsample /></reactredux.provider>, document.getelementbyid("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.7.2/redux.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/react-redux/5.0.6/react-redux.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/redux-form/6.7.0/redux-form.min.js"></script>    <div id="root"></div>

you need set enablereinitialize true when calling redux form higher order component, updates initial values when receives new props redux state:

formsample = reduxform.reduxform({   form: 'formsample',   enablereinitialize: true })(formsample);

see http://redux-form.com/6.0.2/examples/initializefromstate/


Comments

Post a Comment

Popular posts from this blog

What is happening when Matlab is starting a "parallel pool"? -

running parallel cpu processes in matlab starts command parpool() according documentation , function: [creates] special job on pool of workers, , [connects] matlab client parallel pool. this function takes bit of time execute, on order of 30 seconds. in other multi-cpu paradigms openmp, parallel execution seems totally transparent -- i've never noticed behavior analogous matlab (granted i'm not experienced parallel programming). so, happening between time parpool() called , when finishes executing? takes long? parallel computing toolbox enables run matlab code in parallel using several different paradigms (e.g. jobs , tasks, parfor , spmd , parfeval , batch processing), , run either locally (parallelised across cores in local machine) or remotely (parallelised across machines in cluster - either 1 own, or 1 in cloud). in of these cases, code run on matlab workers , copies of matlab without interactive desktop. if you're intending run on remo...
Read more

angular - DownloadURL return null in below code -

when change file updated in firebase storage when try downloadurl show null. filechange(event: any) { const imagefolder: string = this.employee.id; const filelist: filelist = event.target.files; const file: file = filelist[0]; const storageref = firebase.storage().ref().child(`${imagefolder}/profile.jpg`).put(file); console.log(storageref.snapshot.downloadurl); } the put() asynchronous. if want url after file uploaded have this: firebase.storage().ref().child(`${imagefolder}/profile.jpg`).put(file).then((snapshot) => { storageref = snapshot.downloadurl: console.log(snapshot.downloadurl); });
Read more

php - Cannot override Laravel Spark authentication with own implementation -

during login process of laravel spark need request token of remote api. api stores exact same users , passwords laravel spark application. therefore need username , non hashed password of user during authentication process. i thought overriding authenticated method solution problem. in routes/web.php override post /login endpoint , pointing endpoint own logincontroller: <?php namespace app\http\controllers\auth; use illuminate\support\facades\log; use illuminate\http\request; use laravel\spark\http\controllers\auth\logincontroller sparklogincontroller; class logincontroller extends sparklogincontroller { /** * create new login controller instance. * * @return void */ public function __construct() { parent::__construct(); } /** * handle successful authentication attempt. * * @param request $request * @param \illuminate\contracts\auth\authenticatable $user * @return response */ public fu...
Read more