How to use async/await in Vue.js?
You have to use either then
or await
not both as shown below:
If using then
created () { this.getA().then((result) => { console.log(1) console.log(2) this.getB() })},methods : { getA () { return $axios.post(`/getA`,params); }, getB (){ console.log(3) }}
If using await
async created (){ await this.getA() console.log(1) console.log(2) this.getB() },methods : { getA : async() => { return $axios.post(`/getA`,params); }, getB : () => { console.log(3) }}
Note that while calling getB() you don't need then
or await
since it is not asynchronous
Unlike what @thanthu said, you can use both then and await.In your first post you only missed to add return
in the getA
method:
async created (){ await this.getA() console.log(2) await this.getB() },methods : { getA() { return $axios .post(`/getA`,params){ .then((result) => { console.log(1) }); }, getB() { console.log(3) }}
try this
async created (){ let resultFromgetA = await this.getA() console.log(2) await this.getB() },methods : { getA :() =>{ return $axios.post(`/getA`,params); }, getB : async() =>{ //use await key with async calls console.log(3) }}