vue等两个接口都返回结果再执行下一步的实例


Posted in Javascript onSeptember 08, 2020

next 只能?用一次,??可以用 Promise.all 解?Q,等待????步操作都返回?果後再 next:

beforeRouteEnter (to, from, next) {
 // Promise.all ??鹊?到M?鹊 Promise 都 resolve 後才??^?跑(then)
 Promise.all([
  main._base({
   methodName: 'QueryProductInfo',
   productId: to.params.id
  }),
  main._base({
   methodName: 'QueryProductReview',
   type: '0',
   index: '0',
   count: '2',
   productId: to.params.id
  })
 ])
 .then( result => next( vm => {
  // ?绦薪Y果??凑丈厦骓?序放在 result ?到M?龋?? result[0],代表第一??函?档 resolve ?果
  vm.product = result[0].data.product
  vm.shop = result[0].data.shop

  vm.evalData = result[1].data
 }))
}

补充知识:vue 中多接口请求时 按顺序执行接口使用await async

我就废话不多说了,大家还是直接看代码吧~

async getSelectOrg () {
  console.log('----1')
  return axiosPost('/api/uum/org/orglist', {
   accessToken: localStorage.token,
   option: true}).then(response => {
   this.options_grade = []
   if (response.data.data.length > 1) {
    this.options_grade.push({
     value: '-1',
     label: '全部'
    })
    this.formInline.organization = '-1'
   } else if (response.data.data.length === 1) {
    this.formInline.organization = response.data.data[0].orgCode
   }
   for (let i = 0; i < response.data.data.length; i++) {
    let tmp = {}
    tmp.value = response.data.data[i].orgCode
    tmp.label = response.data.data[i].orgName
    this.options_grade.push(tmp)
   }
   console.log('----2')
  }).catch(err => {
   console.log(err)
  })
 },
 async getSelect () {
  await this.getSelectOrg()
  console.log('----3')
  this.searchInfo()
 }
},
mounted () {
 let that = this
 window.onresize = function () { // 定义窗口大小变更通知事件
  // _this.screenWidth = document.documentElement.clientWidth // 窗口宽度
  that.clientHeight = document.documentElement.clientHeight // 窗口高度
 }
 this.getSelect()
},

以上这篇vue等两个接口都返回结果再执行下一步的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中奇葩的假值示例应用
Mar 11 Javascript
JS实现根据当前文字选择返回被选中的文字
May 21 Javascript
Jquery异步提交表单代码分享
Mar 26 Javascript
微信小程序实现tab切换效果
Nov 21 Javascript
浅谈vue的几种绑定变量的值 防止其改变的方法
Mar 01 Javascript
JS常见DOM节点操作示例【创建 ,插入,删除,复制,查找】
May 14 Javascript
Vue仿支付宝支付功能
May 25 Javascript
微信小程序开发之路由切换页面重定向问题
Sep 18 Javascript
详解一次Vue低版本安卓白屏问题的解决过程
May 30 Javascript
微信小程序pinker组件使用实现自动相减日期
May 07 Javascript
在vue中封装的弹窗组件使用队列模式实现方法
Jul 23 Javascript
详解Vue3.0 + TypeScript + Vite初体验
Feb 22 Vue.js
基于postman获取动态数据过程详解
Sep 08 #Javascript
解决vue请求接口第一次成功,第二次失败问题
Sep 08 #Javascript
如何区分vue中的v-show 与 v-if
Sep 08 #Javascript
谈谈JavaScript中的函数
Sep 08 #Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
Sep 08 #Javascript
浅析JavaScript 函数柯里化
Sep 08 #Javascript
Vue.js使用axios动态获取response里的data数据操作
Sep 08 #Javascript
You might like
php的慢速日志引起的Mysql错误问题分析
2014/05/13 PHP
PHP中实现接收多个name相同但Value不相同表单数据实例
2015/02/03 PHP
PHP生成指定随机字符串的简单实现方法
2015/04/01 PHP
PHP设计模式之装饰器模式定义与用法简单示例
2018/08/13 PHP
php-fpm中max_children的配置
2019/03/15 PHP
JavaScript 仿关机效果的图片层
2008/12/26 Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
2011/08/28 Javascript
struts2+jquery+json实现异步加载数据(自写)
2013/06/24 Javascript
Jquery chosen动态设置值实例介绍
2013/08/08 Javascript
单击和双击事件的冲突处理示例代码
2014/04/03 Javascript
href下载文件根据id取url并下载
2014/05/28 Javascript
基于replaceChild制作简单的吞噬特效
2015/09/21 Javascript
JSON对象 详解及实例代码
2016/10/18 Javascript
jquery平滑滚动到顶部插件使用详解
2017/05/08 jQuery
jQuery事件对象的属性和方法详解
2017/09/09 jQuery
利用Decorator如何控制Koa路由详解
2018/06/26 Javascript
JavaScript展开操作符(Spread operator)详解
2019/07/20 Javascript
Vue 刷新当前路由的实现代码
2019/09/26 Javascript
Vue页面刷新记住页面状态的实现
2019/12/27 Javascript
详解Django中的form库的使用
2015/07/18 Python
python脚本设置系统时间的两种方法
2016/02/21 Python
基于python实现聊天室程序
2018/07/27 Python
PyQt编程之如何在屏幕中央显示窗体的实例
2019/06/18 Python
python自动化工具之pywinauto实例详解
2019/08/26 Python
解决在keras中使用model.save()函数保存模型失败的问题
2020/05/21 Python
python爬虫分布式获取数据的实例方法
2020/11/26 Python
HTML5 Canvas draw方法制作动画效果示例
2013/07/11 HTML / CSS
ESDlife健康生活易:身体检查预订、搜寻及比较
2019/05/10 全球购物
小学生家长评语集锦
2014/01/30 职场文书
售后服务承诺书范文
2014/03/26 职场文书
机械机修工岗位职责
2014/08/03 职场文书
群众路线班子对照检查材料
2014/09/25 职场文书
运动会广播稿200米(5篇)
2014/10/15 职场文书
母亲节感言
2015/08/03 职场文书
2015年中秋放假通知范文
2015/08/18 职场文书
Python  lambda匿名函数和三元运算符
2022/04/19 Python