近期做一个项目遇到一点问题 :前端请求后台接口数据 请求完成后 ,将请求到的数据进行赋值,但是在没有请求成功的时候就已经赋了值 ,后来就想到将请求方法执行完毕以后再进行赋值就查找资料,后来大部分解决都用promise就解决的

解决方法实例如下:

function2(){
    // 你的逻辑代码 
    return Promise.resolve(/* 这里是需要返回的数据*/)
}

function3(){
    // 你的逻辑代码 
    return Promise.resolve(/* 这里是需要返回的数据*/)
}

// 调用
function1(){
    this.function2().then(val => { 
        this.function3();
    });
}

但是我用如上方法测试了一下发现,还是没能实现  

接下来就只能用一个办法了:就是将请求后台接口的方法axios异步机制改装成同步机制进行实现

async/await 用法

     (注意:axios用法)

创建方法时:

async function BtnShow(menuId) {
  //按钮初始化
  for (let x in Btns) {
    Btns[x] = false;
  }
  
  var roleId = localStorage.getItem("roleId");

  let res = await axios
    .post(
      baseURL + "/*****/*****",
      qs.stringify({
        Role: roleId,
        Menu: menuId
      }),
      {}
    )
  var bdata = res.data;
  console.log(res.data);
  for (var i = 0; i < bdata.length; i++) {
    if (bdata[i].operationCode == "add") {
      Btns.add = true;
    }
    if (bdata[i].operationCode == "query") {
      Btns.query = true;
    }
  }
}

调用方法时:

async created(){
    var menuId = this.$route.query.menuId;
    await this.GLOBAL.BtnShow(menuId); 
  },

这样就可以解决我的问题了,,

Logo

前往低代码交流专区

更多推荐