vue异步问题使用Promise解决记录

问题描述:

提示:使用Promise来解决前端异步问题
例如:
1.我们有一个程序拥有是三个步骤分别为 {1},{2},{3}
2.在我们执行{1}中需要去获取一个数组[a],而{2}中是需要使用数组[a]的
3.由于前端代码是异步执行,所以有可能我们还没完全获取到[a]时就会执行到{2}步骤,那么这个时候{2}就会出现异常
综上所述这就是我们所说的前端异步问题,本文章介绍使用promise来解决该类问题


promise:

promise是什么
例如:
1、主要用于异步计算
2、可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果
3、可以在对象之间传递和操作promise,帮助我们处理队列


解决思路:

1、 我们直接将数组[a]的来源操作整个变成一个函数请求
2、 之后我们在对需要使用对象进行赋值
理解:这样一来我们整个请求操作就是一个整体,需要整体完成之后在进行接下来的操作,因此可以避免异步问题


直接上代码:

1.我们需要一个叫allParkProtocolList的数组
2.并且需要以下操作进行赋值
在这里插入图片描述
使用promise包装之后:
在这里插入图片描述
在这里插入图片描述
源码

      initParkProtocol({
        'stationId': row.id
      }).then((res) => {
        this.findParam.allParkProtocolList = res
      })
import { queryAllParkProtocolApi } from '@/api/parameterSettingData'
// 加载枪数据
export function initParkProtocol(params) {
  return new Promise((resolve, reject) => {
    allParkProtocolArr = []
    allParkProtocolArr.push({ value: '无', label: '无', flag: '1' })
    queryAllParkProtocolApi(params).then(response => {
      var row = response.data.data
      for (const obj of row) {
        allParkProtocolArr.push({ value: obj.protocolName + '', label: obj.protocolName + '', flag: obj.standardFlag })
      }
      resolve(allParkProtocolArr)
    })
  })
}
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值