59人加入学习
(0人评价)
微信小程序入门与实战--仿网易云音乐

制作完成于2019-09-04,基于微信开发者工具 1.02.1908222

价格 ¥ 420.00
该课程属于 微信小程序 - A计划(永久有效期) 请加入后再学习

课时133,尝试添加一个歌曲重复播放的功能,

添加语句audio.loop = true;

该语句可以实现歌曲的重复播放,但是onTimeUpdate没有随之而重新执行.

 

根据百度查得,是因为触发onWaiting导致,尝试在audio.loop = true;语句后面加上之前的解决方法

setTimeout(() => { console.log(audio.paused) }, 100)

没有效果,其原因是,应该没有找准执行该语句的时机

setTimeout(() => { console.log(audio.paused) }, audio.duration*1000+100)

这样,效果就达到了,onTimeUpdate随之执行了,

但是,如果播放的时候,有暂停,或拖动,时间就不吻合类了,因此,必须是在触发重新播放歌曲的时候,调用这个语句.

未能查得audio.loop = true;的时候,具体的时机,

因此,转变思路,改为人为循环播放,

直接在onTimeUpdate中执行一次拖动事件,并随之执行一次setTimeout函数,即可

        if (duration-currentTime < 0.3) {

          audio.seek(0)

          setTimeout(() => {

            console.log(audio.paused)

          }, 100)

        }

效果达成

至于这个0.3的来源,监听onTimeUpdate得来,onTimeUpdate在模拟器中每秒执行了4次

即0.25秒执行一次,所以这个用于判断的值一定要大于0.25即可

[展开全文]

授课教师

SiKi学院老师

课程特色

下载资料(1)
视频(140)

学员动态