[Vuejs]-Using promises in Axios requests

2👍

You can solve this by chaining promises, assuming that d3.json returns a promise:

created() {
    let vm = this;
    let url = `/api/profile/${this.$route.params.id}`;
    axios.get(url)
      .then(response => {
        this.profile = response.data
        return d3.json(response.data.fileName)
      }).then(data => {
        //do some stuff
      }).catch(err => {
        //log error
      })
}

2👍

That’s where async/await comes in handy. A you don’t need to save this to a variable and B you have cleaner, more readable code.

async created() {

    const url = `/api/profile/${this.$route.params.id}`;
    const { data } = await axios.get(url); // Optional destructuring for less clutter
    this.profile = data;

    const d3Data = await d3.json(data.fileName);
    //do whatever you want

}

0👍

async created() {
let vm = this;

let url = `/api/profile/${this.$route.params.id}`;
try {
const {data} = await axios.get(url)

const d3Data = await d3.json(data.fileName)
    } catch(err) {
      //error
    }
}

Leave a comment