vue中使用 async & await

 获取用户信息userid ->获取地址列表 ->获取用户的所在地址(根据地址列表循环,显示所在的地址)->渲染歌曲列表
mounted:async function() {
    if(GetUrlParam('cityId')==0||GetUrlParam('cityId')){
        let res=await this.getAreaList();
        this.arrAreaList=res.data.provinceList;
        this.getCityName(GetUrlParam('cityId'));
        this.getSingerList();
    }else{
        this.getUserInfo();
    }
    
},
methods: {
    // 获取用户信息
    getUserInfo() {
            // 未登录,端外 默认北京
        if (!isVVmusic) {
            this.asyncFn();
            return;
        }
        vvsing.evoke('getContext', null, function(data) {
            if( data.isLogined==1){
                let userId = data.userInfo.vVNum || data.userInfo.VVNum;
                this.asyncFn(userId);
            }else{
                this.asyncFn();
            }
        }.bind(this));

    },
    // 异步操作
    async asyncFn(userId){
        userId=userId||'';
        let res=await this.getAreaList();
        // 处理返回结果
        this.arrAreaList=res.data.provinceList;

        let res1=await this.getUserAddress(userId);
        console.log(res1);
        // 处理返回结果
        if(!res1||!res1.data.discover){
            this.curProvinceName='北京';
            this.curProvinceID=1202;
        }else{
            let cityId = res1.data.discover.cityId+'';;
            this.getCityName(cityId);
        }
            
        this.getSingerList();
    },
    // 获取地址列表
    getAreaList(userId,callBack,cityId){
            return axios.get(baseURL + 'cms/api/fetch.do?cmd=discoverService|selectProvince&req={}')
    },
    // 获取用户地址信息
    getUserAddress(userId){
        if(!userId) return;
        let req=encodeURIComponent(`{"query":{"userId":${userId}}}`);
        return axios.get(baseURL + 'cms/api/fetch.do?cmd=discoverService|selectuserCityId&req='+req)
        
    },
    // 获取地址名称
    getCityName(cityId){
        if(cityId==0){
            this.curProvinceName='火星';
            this.curProvinceID=cityId;
        } else { //国内
            //其他地区 定位北京
            this.curProvinceName='北京';
            this.curProvinceID=1202;
            this.arrAreaList.some(function(item) {
                if (cityId.substring(0, 4) ==item.provinceID) {
                        this.curProvinceName=item.provinceName;
                        this.curProvinceID=cityId.substring(0, 4);
                        return true;
                } 
            }, this);

        }
    },
    // 获取歌手列表
    getSingerList(){
        var req=encodeURIComponent(`{"query":{"gender":"${this.curGender}","provinceID":${this.curProvinceID}},"page":{"pageSize":20,"pageNo":${this.curPage}}}`);
        axios.get(baseURL + 'cms/api/fetch.do?cmd=discoverService|selectProvincePage&req='+req, {
            emulateJSON: true
        }).then((res)=> {
            var data = res.data;
            this.arrSingerList=this.arrSingerList.concat(data.discoverList);

        },(err)=> {
            console.log(err);
        });
    },
    
}
原文地址:https://www.cnblogs.com/yuesu/p/9593415.html