Async function to get JSON returns nothing

Question

I have the following function in my project that I access from several files.

getCountry: async function () {
  let country = null
  try {
    axios
    .get('http://ip-api.com/json/')
    .then(response => (this.country = response.data.countryCode))
    console.log('Country', country)
  } catch (error) {
    console.log(error)
  }
  return country
}

It works on the other files, but for some reason I cannot use it successfully in a particular file with this situation.

This is my data part:

 data() {
    return {
      model: {
        country: '',
        state: '',
        city: ''
      },
      country: null
    }
  },

And on mount part I am trying to do the following:

this.country = await this.getCountry()
if (this.country != null) {
  this.model.country = this.country
}

The value never gets assigned to model.country. When I check this.country value, it gets the result from the function. I suppose it might have something to do with the fact that it's an async function, but I am not sure what to do.

In your browser's network check if its calling the api or not and share complete info — MaBbKhawaja
– MaBbKhawaja, Commented Jul 10, 2020 at 6:19
I think that the function doesn't have time to complete before it gets assigned to model.country. — user13802611
– user13802611, Commented Jul 10, 2020 at 6:31

Praveen Dass · Accepted Answer · 2020-07-10 06:27:33Z

1

await should be used inside an async function, not outside it. Please try

getCountry: async function () {
  let country;
  try {
    const response = await axios.get('http://ip-api.com/json/');
    country = response.data.countryCode;
  } catch (error) {
    console.log(error)
  }
  return country
}

answered Jul 10, 2020 at 6:27

Praveen Dass

6261 gold badge4 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Async function to get JSON returns nothing

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related