Uniapp-远离回调callback请使用await、async

今天要实现一个功能，在搜索完课程及句子之后判断是否有结果，因为需要对课程和句子的结果统一判断，所以要使用async, await来将两种搜索的异步方法可以顺序调用。

来看下如何得到课程：

searchLessonsFromServer(){if(this.no_more_lessons){return}let self=thislet page= self.searchMeResult.pth_lessons.page//let per_page=10//每页5个记录let toServerUrl=`${this.$backHost}/api/v1/users/${this.$user.id}/lessons/search_me/${self.latestSearchValue}/${per_page}/${page}`returnnewPromise((resolve, reject)=>{this.$request({             url: toServerUrl,             success:((res)=>{                 console.log('lessons#searchLessonsFromServer in Promise():', res);if(res.pth_lessons.length!=0){                     self.searchMeResult.pth_lessons.data=[...self.searchMeResult.pth_lessons.data,...res.pth_lessons]}else{                     self.no_more_lessons=true}resolve(res)})});})},

异步方法最后返回一个Promise，这样就可以在其它函数中将其用同步的办法来调用searchLessonsFromServer函数。

这里实现的课程搜索是有翻页功能的，得到服务器返回的数据res之后，用三点扩展符将其添加到前端的数据中，

self.searchMeResult.pth_lessons.data=[...self.searchMeResult.pth_lessons.data,...res.pth_lessons]

搜索句子也是类似的将异步方法放到new Promise之中， 然后在其它函数中这样调用：

//服务器搜索课程名称asyncsearch_me(){...awaitthis.searchLessonsFromServer()awaitthis.searchSentencesFromServer()if(!this.haveSearchResult()){let errMsg="搜索不到:"+this.latestSearchValue         uni.showModal({             title:'提示',             content: errMsg,             showCancel:false,});this.search_focus=truereturn}else{this.searchValue=this.latestSearchValue}}

即在调用函数search_me前面加上async, 使用异步方法时，前面加上await即可！这样，后续的haveSearchResult就肯定是在前面两个异步的搜索函数完成之后才会执行！

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QzDYdHGz-1646640234157)(https://dw.gsenglish.cn:5543/uploads/2022/03/clipboard-202203011734-0lebb.png)]

更多async,await 相关知识可以参考：https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Asynchronous/Async_await

我是@爱玩的安哥，关注我获取更多有用知识