大家好，如果您还对后端异步处理不太了解，没有关系，今天就由本站为大家分享后端异步处理的知识，包括后端异步处理的问题都会给大家分析到，还望可以解决大家的问题，接下来我们就开始吧！
在写VUE前端代码时，会遇到将带有return结果的异步请求函数（如请求后台数据）设置为公共函数，在其他地方调用的场景。但是因为是异步请求数据，实际需要return的值在调用返回时，还未生成，所以导致return的内容为undefined。（见参考[1]的分析）
例如：公共函数和调用方式
//公共函数：根据异步返回的内容确定return值true或falsefunction a(){ api({ url: "/xxx/xxxx",? ? ?//后端异步请求 method: "get", }).then((retData) => { if(retData.list.length > 0){ return true; }else{ return false; } })}//调用位置checkData(){ var result = a(); //result值为undefined！！}
调用返回时，因为异步请求还未结束，真正的结果还没有获取到，所以以上代码调用位置result得到的返回值为“undefined”。
解决方案：
通过Promise + async/await实现异步return调用
//公共函数：根据异步返回的内容确定return值true或falsefunction a(){ return new Promise((resolve,reject)=>{ api({ url: "/xxx/xxxx",? ? ?//后端异步请求 method: "get", }).then((retData) => { if(retData.list.length > 0){ resolve(true); }else{ resolve(false); } }) })}//调用位置async checkData(){ var result = await a(); //result值为期望的true或false}
2. 通过回调函数实现异步return调用
//公共函数：根据异步返回的内容确定return值true或falsefunction a(func){ api({ url: "/xxx/xxxx",? ? ?//后端异步请求 method: "get", }).then((retData) => { if(retData.list.length > 0){ if(typeof func === "function"){ func(true); } }else{ if(typeof func === "function"){ func(false); } } })}//调用位置checkData(){ var result; a(function(ret){ result = ret; //result值为期望的true或false }); }
如果在回调函数里面将return返回值赋值给全局变量this.xxx，不能直接this.xxx = ret，需要将this作为变量来引用（参考[2]说明），方法如下：
data() { return { result: true; };｝methods:{ checkData(){ a(function(ret){ this.result = ret; //这里报错：Uncaught (in promise) TypeError: Cannot read properties of undefined }); }， checkData2(){ var this_alias = this; a(function(ret){ this_alias.result = ret; //正确的写法 }); }}
[1] vue中函数为什么不能在异步操作里return出数据_PC_136的博客-CSDN博客_vue异步return
[2] JS中this的指向问题（Uncaught (in promise) TypeError: Cannot read property ‘$router‘ of undefined）_whitek387的博客-CSDN博客
关于后端异步处理的内容到此结束，希望对大家有所帮助。
