title: How to make synchronous API call request in react js
body: <p>i am beginner to react js i am working on a small application which makes api requests frequently. So the problem i am facing is there is a page with form fields prefilled from the db, if the user makes changes to those fields i am posting the new filed values to db. when submit button is clicked saveAndConttinue() is called,from there addNewAddress() is invoked based on the condition. But the problem is the response that i get from addNewAddress has to be used for the next api call in the queue, but it is taking time to get response, and the address_id is having null values for it's post call. is there any way to make synchronous call in react with out using flux/redux for now?</p>
  
  <pre><code>saveAndContinue(e) {
  e.preventDefault();
  
  if(this.props.params.delivery === 'home_delivery' &amp;&amp; this.state.counter) {
    this.addNewAddress();
  }
  
  console.log('add id is '+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));
  }
  </code></pre>