【WePY小程式框架實戰四】-使用async&await非同步請求資料

摘要： async await 是對promise的近一步優化,既解決了promise鏈式then的這種寫法壁壘，又讓非同步請求更像同步，若對async await不太瞭解的同學可以直接參考阮一峰老師的文章async 函式的含義和用法 ,這裡我們只關注怎麼在小程式wepy架構中如何使用。...

async await 是對promise的近一步優化,既解決了promise鏈式then的這種寫法壁壘，又讓非同步請求更像同步，若對async await不太瞭解的同學可以直接參考阮一峰老師的文章ofollow,noindex" target="_blank">async 函式的含義和用法 ,這裡我們只關注怎麼在小程式wepy架構中如何使用。

依賴庫

import 'wepy-async-function'

app.wpy中啟用

export default class extends wepy.app {
constructor () {

super()
this.use('promisify'); 
}
}

使用例項

getData(x){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
if(x%2 === 0){
resolve(x)
}else{
reject(`${x}是不正確的輸入`);
}
},x*1000)
})
}


async onLoad() {
try{
let data1 = await this.getData(2);
console.log(data1);
let data2 = await this.getData(1);
console.log(data2);//已經異常不再執行
}catch(error){
console.log(error);
}
}

呼叫

onLoad() // 以同一時間為基準，2秒後輸出2，3秒後輸出 1不是正確的輸入

getData().then(fun(),fun()