微信小程序异步处理(个人记录)

最新推荐文章于 2024-04-23 02:44:45 发布

weixin_53076986

最新推荐文章于 2024-04-23 02:44:45 发布

阅读量412

点赞数

文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/weixin_53076986/article/details/129340581

版权

业务逻辑：先使用url获取音乐的播放路径然后根据播放路径使用播放音乐。

实际开发过程中，因为微信小程序onLoad()方法是异步进行的，在未获取到音乐播放url前就使用了this.data中的空数据，则导致播放路径为空，播放出错

解决办法：使用Promise来保证程序按照我想要的顺序执行

getMusicPlayUrl: function (e) { //需要先执行的getUrl
        return new Promise((reslove, reject) => {
            wx.request({
                url: getApp().globalData.APIurl + '/song/url/v1?id=' + this.data.musicid + '&level=exhigh',
                success: (result) => {
                    // console.log("进入成功")
                    // console.log(result.data.data[0].url)
                    // console.log( "类型是：" + typeof result.data.data[0].url)
                    this.setData({
                            musicPlayUrl: result.data.data[0].url,
                        }),
                        reslove(result.data, result)
                    console.log("GetURL成功" + this.data.musicPlayUrl)
                },
                fail: (msg) => {
                    reject('请求失败');
                }
            })
        });
    },

    //调用音乐播放接口
    getMusicPlay: function (e) {
        this.getMusicPlayUrl().then(result => {
            this.innerAudioContext = wx.createInnerAudioContext()
            this.innerAudioContext.autoplay = true
            console.log("GetURL了吗？" + this.data.musicPlayUrl)
            this.innerAudioContext.src = this.data.musicPlayUrl
            this.innerAudioContext.onError((res) => {
                console.log(res.errMsg)
                console.log(res.errCode)
            })
            console.log(result);
        }).catch(err => {
            console.log(err);
        })

    },