reactjs - How to make synchronous API call request in react js -


i beginner react js working on small application makes api requests frequently. problem facing there page form fields prefilled db, if user makes changes fields posting new filed values db. when submit button clicked saveandconttinue() called,from there addnewaddress() invoked based on condition. problem response addnewaddress has used next api call in queue, taking time response, , address_id having null values it's post call. there way make synchronous call in react out using flux/redux now?

saveandcontinue(e) { e.preventdefault();  if(this.props.params.delivery === 'home_delivery' && this.state.counter) {   this.addnewaddress(); }  console.log('add id '+this.state.address_id); const config = { headers: { 'content-type': 'multipart/form-data' } }; let fd = new formdata(); fd.append('token', this.props.params.token); fd.append('dish_id', this.props.params.dish_id); fd.append('address_type', this.props.params.delivery); fd.append('address_id', this.state.address_id); fd.append('ordered_units', this.props.params.quantity); fd.append('total_cost', this.props.params.total_cost); fd.append('total_service_charge', this.props.params.service_charge); fd.append('net_amount', this.props.params.net_cost); fd.append('hub_id', this.props.params.hub_id); fd.append('delivery_charge', this.props.params.delivery_charge); fd.append('payment_type', this.state.payment_type); fd.append('device_type', 'web');  axios.post(myconfig.apiurl + '/api/foody/orders/purchase' , fd, config)         .then(function(response){     if(response.data.success) {       console.log(response);       browserhistory.push('/order_confirmed/');     } else {       console.log(response);       //alert(response.data.message)     }         }); }  addnewaddress() {  const config = { headers: { 'content-type': 'multipart/form-data' } };  let fd = new formdata();    if(this.props.params.user_type === 'new') {     fd.append('type', 'primary');   }    fd.append('token', this.props.params.token);   fd.append('block', this.state.block);   fd.append('door_num', this.state.door_num);   fd.append('address', this.props.params.address);   fd.append('locality', this.props.params.locality);   fd.append('landmark', this.props.params.landmark);   fd.append('hub_id', this.props.params.hub_id);   axios.post(myconfig.apiurl + '/api/user/add-address' , fd, config)     .then(function(response){       this.setstate({address_id: response.data.data['id']});       console.log(this.state.address_id);     }.bind(this)); } 

you're going have call next request in queue after addnewaddress() in returned promise of addnewaddress():

addnewaddress() {   axios.post()...   .then(function (response) {      // set state     this.setstate({address_id: response.data.data['id']});      // [call next api request here]     // ...    }) } 

doing synchronous calls bad idea, advise against , next call in returned promise shown above.


Comments

Popular posts from this blog

javascript - Clear button on addentry page doesn't work -

c# - Selenium Authentication Popup preventing driver close or quit -

tensorflow when input_data MNIST_data , zlib.error: Error -3 while decompressing: invalid block type -