how to return response of axios in return

You can use Promises:

I am new to react so you can give suggestions to me to improve my code.

For example I want to call checkVerified() function which is in other file:

Utils.js

export function checkVerified(val, values) {
    return new Promise((resolve, reject) => {
        axios
            .get(`${getInitialServerUrl}/core/check_verified/${val}/`)
            .then(res => {
                resolve(res)
            })
            .catch(err => reject(err))
    })
}

And I am calling this function from an another file:

someFile.js

const handleSubmit = e => {
        e.preventDefault();
        checkVerified(values.mobile, props)
            .then(res => {
               console.log(res);
         })
        .catch(err => console.log(err.response))
    }

You will need to wrap the call to axios in an async function. You can then return the response as you normally would.

As long as you call the wrapper method with await, you will be fine. Unfortunately, in order to call it with await, the calling method will also have to be marked async, and so on and so on, until every function in your application must be marked async and you will need to call ALL of your functions with await.

This is the magic and the beauty of the async / await keywords - utter garbage. You may see examples that create an async lambda to wrap the await axios, in an attempt to not have to refactor their entire app, but its not going to work.

So, the wrapper looks like the following...

async public post(URL, data) {

axios.post(URL, data)
    .then( (result) => {
        return result;
    });

}

If you are using typescript, that will add several more frustrating issues, such as how to cast an any to the type you want to return. I might suggest union types.

Anyway, good luck!

P.S. axios won't work if your environment requires using a proxy. In that case, and probably all others, use node-fetch - you will be up and running with node-fetch in a day. Axios will have you scratching your head a week later, wondering why its not working.

console.log won't wait for the function to fully complete before logging it. This means that you will have to make wallet.registerUser asynchronous, there are two main ways to do this:

1. Callback - this is when you pass a function as a parameter into your existing function which will be executed once your axios call has finished. Here is how it would work with your code:

   wallet.registerUser=function(data, callback){
     axios.post('http://localhost:8080/register',{
       phone:data.phone,
       password:data.password,
       email:data.email
     }).then(response =>{
       callback(response.data.message);
       console.log(response.data.message);
     }).catch(err =>{
       console.log(err);
     })
   }
   
   wallet.registerUser(data, function(response) {
     console.log(response)
   });
   

2. Promise - The easiest way to do this is to put async in front of your function name. This will make anything returned from the function return in the form of a promise. This is how it would work in your code:

    wallet.registerUser=async function(data){
     axios.post('http://localhost:8080/register',{
       phone:data.phone,
       password:data.password,
       email:data.email
     }).then(response =>{
       return response.data.message;
       console.log(response.data.message);
     }).catch(err =>{
       console.log(err);
     })
   }
   
   wallet.registerUser(data).then(function(response) {
     console.log(response);
   });
   

Here is some more information on asynchronous functions:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

https://developer.mozilla.org/en-US/docs/Glossary/Callback_function