1. 程式人生 > >【WePY小程序框架實戰四】-使用async&await異步請求數據

【WePY小程序框架實戰四】-使用async&await異步請求數據

怎麽 === per await 頁面 .cn port 寫法 含義

  • 【WePY小程序框架實戰一】-創建項目
  • 【WePY小程序框架實戰二】-頁面結構
  • 【WePY小程序框架實戰三】-組件傳值

async await 是對promise的近一步優化,既解決了promise鏈式then的這種寫法壁壘,又讓異步請求更像同步,若對async await不太了解的同學可以直接參考阮一峰老師的文章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()

【WePY小程序框架實戰四】-使用async&await異步請求數據