promise 多个接口完成后进行操作

tencade

已于 2023-06-15 00:14:37 修改

阅读量247

点赞数

文章标签： javascript elementui vue.js

于 2021-11-24 14:27:16 首次发布

本文链接：https://blog.csdn.net/tentime/article/details/121514826

版权

该代码段展示了如何通过Promise.all异步加载事件日程(eventRead)和用户关联案件(groupclientRead)的数据。加载成功后，根据用户所属案件过滤日程列表，将符合条件的日程推送到taskData中进行渲染。日程列表(eventList)和用户案件列表(groupclientList)在控制台中被打印出来用于调试。

摘要由CSDN通过智能技术生成

readItems () {
      // 根据案件id 查询相对应的日程
      let p1 = new Promise((resolve, reject) => {
        this.get({
          url: 'eventRead',
          data: this.condTask
        }, r => {
          if (r.code) {
          	resolve('请求成功')
            this.eventList = r.data.items
          } else {
            reject('上传失败 请您稍后再试')
            this.eventList = []
          }
        })
      })
      // 查询用户id所对应的案件
      let p2 = new Promise((resolve, reject) => {
        this.get({
          url: 'groupclientRead',
          data: {
            account_id: this.$.g(config.storage.accountid)
          }
        }, (res) => {
          if (res.code) {
          	resolve('请求成功')
            this.groupclientList = res.data.items
          } else {
            reject('上传失败 请您稍后再试')
            this.groupclientList = []
          }
        })
      })
      Promise.all([p1, p2]).then((result) => {
        // taskData 要渲染的日程列表
        // eventList 查询到的所有案件的日程 包括不属于当前用户的案件的日程
        // groupclientList 查询到的用户所对应的案件
        // 根据用户所对应的案件 筛选eventList所有日程列表内符合的push进taskData
        console.log(this.eventList)
        console.log(this.groupclientList)
      }).catch((error) => {
        console.log(error)
      })
}