vue中axios实现同步请求(代码实现iview的table多选框默认选中)

实现同步重点在于添加async、await,且后台请求方法与调用者都需要添加,也就是添加两组,经测试单独添加任何一组都无效

axios封装的请求, user.js

import axios from '@/libs/api.request'

export const getAllUser = (data) => {
  return axios.request({
    url: 'user/mgt/getAllUser',
    method: 'post',
    data: data
  })
}

方法调用与同步请求

import { getAllUser } from '@/api/user'

// 方法调用
async getList(){
  let _this = this
  await getAllUser({
    queryParams: JSON.stringify(this.search),
    type: 1
  }).then(res => {
    debugger
    let { data, total } = res.data.data
    this.list = {
      data: data,
      total: total,
      loading: false
    }
  }).catch(err => {
    console.log(err)
  })
},

// 调用getList方法
async showModal (name, userIds, userNames) {
        this.modal.visible = true
        this.selectData.ids = userIds
        this.selectData.alias = userNames
        await this.getList(userIds)
        debugger
        let users = []
        if (userIds && this.list.data) {
          users = userIds.split(",")
          users.forEach((item, index, users) => {
            for (let i=0;i<this.list.data.length;i++) {
              debugger
              if (this.list.data[i].id === item) {
                this.$refs.table.$refs.tbody.objData[i]._isChecked = true;
              }
            }
          })
        }
      },

说明:因为需要getList()方法执行完成之后才允许执行let users = []之后的代码,所以getList()必须要加同步,代码中debugger调试后会发现先执行完axios请求并且从服务器返回数据之后才执行下面的代码

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值