关于前端:vue-asyncawait-使用方式浅谈

VUE 中，咱们市场会遇到一种理论利用状况：B 处的渲染须要依赖 A 处的接口返回，然而因为种种原因，不能将 B 间接放在 A 接口返回后的代码解决外面。这时候咱们就须要应用 async/await 将异步转为同步，通知 B，等 A 有返回后你再执行

两个中央有改变：

sample.vue:

/** 省略其余代码 **/
import serviceschemsjs from '../../assets/js/serviceschema'
/** 省略其余代码 **/
/**
此处为动作触发口
serviceschemsjs 为第三方引入的 js 插件
schematypes 办法中有调用接口
changeTypeList 须要用到 schematypes 中接口返回的数据（typelist）如果没有 async 和 await 那么 changeTypeList 的执行就没有方法失去最新的数据
**/
async changeActiveService(data){
  // 通过 endpoint 获取服务下类型列表
  data.typelist=[]
  await serviceschemsjs.schematypes(data)
  this.changeTypeList(data)
},
changeTypeList(data){
/** 此处的 data.typelist 最新的 **/
/** 你的其余须要解决该数据的代码 **/
}

serviceschems.js:

/**
接口申请处也须要做异步同步解决 **/
async schematypes(data) {if (!data) {return}
        /** 假代码 **/
        var url = data.url; 
        var token = token;
        // 接口须要有返回后才执行后续
        await QTgqlutil.fetchIntrospectionQuery(url, '', token).then(result => {data.typelist = []
            data.typelist =result.list
        })
    }