关于前端: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
        })
    }

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理