Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Function call from inside axios then?

Tags:

reactjs

axios

How to call a function from inside axios then below is my code which is not working

handleClick(userid){
  axios.get(
    "http://localhost:4000/user/"+userid+"/items.json")
    .then(function (response) {
      dispatch(this.buildhtml.bind(response))
    })
}


  buildhtml(response){
  console.log("m called")
  }

buildhtml function is not executing !! any idea

like image 446
ashwintastic Avatar asked Sep 08 '16 12:09

ashwintastic


People also ask

Can we use then with Axios?

First, Axios allows us to work with only one promise( . then() ) and with JSON data by default unlike in the Fetch API where we must first convert the request body to a JSON string in the first promise: // With Fetch fetch(url) . then((response) => response.

How do you call a function in Axios response?

To use axios in any of your projects you must first import it by assigning it to a variable, which is usually called axios, though you are free to name it anything else. Once that is done you can make different requests like axios. get() or axios.

How to send request using Axios?

This method uses the same request structure as the browser method does: const axios = require('axios'); const getUser = async () => { const getResponse = await axios . get("https://jsonplaceholder.typicode.com/users/1") . then((response) => response) .

What does Axios return?

Axios Response object When we send a request to a server, it returns a response. The Axios response object consists of: data - the payload returned from the server. status - the HTTP code returned from the server.


2 Answers

Your code is not working working because your this would be undefined with the current implementation you have.

Can you try this?

handleClick(userid){
  var self=this;
  axios.get(
    "http://localhost:4000/user/"+userid+"/items.json")
    .then(function (response) {
      self.buildhtml.bind(response) // would work
      dispatch(self.buildhtml.bind(response)) //wont work
    })
}

  buildhtml(response){
  console.log("m called")
  }

Now i see above wont work too, even though you change it to self. You are trying to using dispatch. In dispatch you need to pass an action. . Reducers take state and action as parameters and they update state based on what action is passed.

Now an action may return an object or a function. Please go through concepts of redux once. This is not the way an action should be dispatched

like image 190
Harkirat Saluja Avatar answered Sep 19 '22 01:09

Harkirat Saluja


When using Vue.js with axios ,I too had this Issue but , this is how I solved it.

let vue = new Vue({
 el:#<element>,
 methods:{

  method1()
  {
 axios.post('<url>',{<data>})
 .then( ( res ) => {
  this.method2(res)  // method call to method2 
  } )
 .catch( ( err ) => { <call> } );     
  },//method1 end

method2(res){
// statements
} 

}
});

Refer this.

like image 24
guru_007 Avatar answered Sep 18 '22 01:09

guru_007