欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue中的同步和異步調(diào)用順序詳解

 更新時(shí)間：2022年01月24日 11:55:55   作者：neoeson  
這篇文章主要介紹了Vue中的同步和異步調(diào)用順序，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

Vue的同步和異步調(diào)用順序

Vue中的方法調(diào)用順序是依次進(jìn)行的，方法體內(nèi)部也是依次執(zhí)行的，但是，兩個(gè)方法體的執(zhí)行順序并不能?chē)?yán)格控制。

以下方法中都帶有promise函數(shù)或異步調(diào)用。

?? ?initUserData() {
?? ? ?this.getPsCountryList() // 1 獲取國(guó)家列表stateOptions，方法內(nèi)同步
?? ? ?this.getTimeZone() // 2 獲取時(shí)區(qū)timezones，方法內(nèi)同步
?? ? ?this.getUserInfo() // 3 獲取用戶信息
?? ?}

在實(shí)際運(yùn)行中，三個(gè)方法的執(zhí)行順序是1-2-3，但是方法3始終不能獲取到stateOptions和timezones

背后的調(diào)用順序是1-2-3，但是，方法的執(zhí)行時(shí)間并沒(méi)有嚴(yán)格控制。

如果想要做到方法調(diào)用和執(zhí)行是同步的，可以使用async和await修飾符。

例如

?? ?async initUserData() {
?? ? ?await this.getPsCountryList() // 1 獲取國(guó)家列表stateOptions，方法內(nèi)同步
?? ? ?await this.getTimeZone() // 2 獲取時(shí)區(qū)timezones，方法內(nèi)同步
?? ? ?await this.getUserInfo() // 3 獲取用戶信息
?? ?}

Vue兩個(gè)異步方法順序執(zhí)行

需求：兩個(gè)異步函數(shù)按順序執(zhí)行，首先獲取第一個(gè)異步函數(shù)的返回的值，接著在第二個(gè)異步函數(shù)里面調(diào)用

方法：先在第一個(gè)異步函數(shù)里返回一個(gè)promise，接著用async和await調(diào)用它

第一個(gè)異步方法

getAllNotice() {
?? ??? ??? ??? ?let data = {
?? ??? ??? ??? ??? ?"searchParams": [{
?? ??? ??? ??? ??? ??? ?"fieldName": "equipmentId",
?? ??? ??? ??? ??? ??? ?"operate": "eq",
?? ??? ??? ??? ??? ??? ?"value": "000000"
?? ??? ??? ??? ??? ?}],
?? ??? ??? ??? ??? ?"size": -1
?? ??? ??? ??? ?}
?? ??? ??? ??? ?return new Promise((resolve) => {
?? ??? ??? ??? ??? ?API.getNotice(data).then(res => {
?? ??? ??? ??? ??? ??? ?console.log(res)
?? ??? ??? ??? ??? ??? ?if (res.data.code == "200") {
?? ??? ??? ??? ??? ??? ??? ?this.noticeList = res.data.data.list
?? ??? ??? ??? ??? ??? ??? ?console.log(this.noticeList)
?? ??? ??? ??? ??? ??? ??? ?resolve();
?? ??? ??? ??? ??? ??? ??? ?return
?? ??? ??? ??? ??? ??? ?} else {
?? ??? ??? ??? ??? ??? ??? ?uni.showToast({
?? ??? ??? ??? ??? ??? ??? ??? ?title: res.data.message,
?? ??? ??? ??? ??? ??? ??? ??? ?duration: 1000,
?? ??? ??? ??? ??? ??? ??? ??? ?icon: "none"
?? ??? ??? ??? ??? ??? ??? ?})
?? ??? ??? ??? ??? ??? ?}
?? ??? ??? ??? ??? ?})
?? ??? ??? ??? ?})?? ??? ??? ??? ?
?? ??? ??? ?},

第二個(gè)異步方法

//獲得當(dāng)前的公告列表
?? ??? ??? ?getNowNotice(){
?? ??? ??? ??? ?//獲取當(dāng)前時(shí)間戳
?? ??? ??? ??? ?var timestamp = (new Date()).getTime();
?? ??? ??? ??? ?var _this = this
?? ??? ??? ??? ?console.log(timestamp);
?? ??? ??? ??? ?//將noticeList的結(jié)束時(shí)間轉(zhuǎn)換成時(shí)間戳
?? ??? ??? ??? ?for(var i=0; i<this.noticeList.length; i++){
?? ??? ??? ??? ??? ?var endTimeStamp = TIME.TimeToTimeStamp(this.noticeList[i].endTime)
?? ??? ??? ??? ??? ?console.log(endTimeStamp)
?? ??? ??? ??? ??? ?if(endTimeStamp>timestamp){
?? ??? ??? ??? ??? ??? ?_this.noticeNewList.push(this.noticeList[i])
?? ??? ??? ??? ??? ?}
?? ??? ??? ??? ?}
?? ??? ??? ??? ?console.log("noticeNewList",_this.noticeNewList)
?? ??? ??? ?}

用async和await

async onLoad(option) {
?? ??? ??? ?await this.getAllNotice()
?? ??? ??? ?await this.getNowNotice()
?? ??? ?},

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論