小程式使用 async await

廣州蘆葦科技web前端發表於2018-12-15

實踐的方式如下:

  • 第一個問題: 雖然小程式不支援,但是我們可以引入js庫啊。雙手奉上facebook的開源庫regenerator 下載'packages/regenerator-runtime'這個路徑下的runtime.js,放到自己小程式專案下的utils或者lib資料夾下。

  • 第二個問題: Async跟Await的用法

  • Async - 定義非同步函式(async function someName(){...})

    • 自動把函式轉換為 Promise
    • 當呼叫非同步函式時,函式返回值會被 resolve 處理
    • 非同步函式內部可以使用 await
  • Await - 暫停非同步函式的執行 (var result = await someAsyncCall();)

    • 當使用在 Promise 前面時,await 等待 Promise 完成,並返回 Promise 的結果
    • await 只能和 Promise 一起使用,不能和 callback 一起使用
    • await 只能用在 async 函式中
import regeneratorRuntime from '../../utils/runtime.js'

onLoad: function() {
    this.initData();
  },

  async initData(){
	await this.initMyData();//請求介面1
	await this.initTodayData();//請求介面2
  }

  initMyData:function(){
	console.log('開始請求1')
	........
	//回撥函式的方法內寫
	console.log("完成請求1")
	
	
}

  initTodayData:function(){
	console.log('開始請求2')
	........
	//回撥函式的方法內寫
	console.log("完成請求2")
}
複製程式碼

  • 作者簡介:何永峰,蘆葦科技web前端開發工程師,喜歡到處尋找好吃的,平時愛好是跳舞,打籃球,聽音樂,有時會出席一些大型的舞蹈商演活動,目前是Acum.Revolution現狀革命成員之一。並且代表作品:萌雞駕到、美旅出行小程式、電競桌子小程式。擅長網站建設、公眾號開發、微信小程式開發、小遊戲、公眾號開發,專注於前端領域框架、互動設計、影像繪製、資料分析等研究,訪問 www.talkmoney.cn 瞭解更多。

相關文章