• 【uniapp】audio.onTimeUpdate在微信小程序上面的问题


    1、h5的audio.onTimeUpdate是多个都会执行,微信小程序会覆盖,只执行最新一个。

    方法1:给audio对象添加一个属性,进度更新监听要执行的方法数组audio.onTimeUpdateList。然后在需要启动监听的地方执行监听,比如在播放事件onPlay中。再加个属性onTimeUpdateExist,避免h5重复监听

    //声明进度更新事件
                    that.audio.onTimeUpdateList=[{name:that.modelName+"-audio",func:function(){
                        console.log("onTimeUpdate1");
                        // console.log("onTimeUpdate");
                        if (!that.seek) {
                            that.current = that.audio.currentTime
                        }
                        if (!that.duration) {
                            that.duration = that.audio.duration
                        }
                    }}];
    //音频播放事件
                    that.audio.onPlay(() => {
                        console.log("onPlay");
                        
                        //实现进度监听事件//h5的audio.onTimeUpdate多个都会执行,微信小程序会覆盖,只执行最新一个。
                        if(!that.audio.onTimeUpdateExist && that.audio.onTimeUpdateList){
                            that.audio.onTimeUpdateExist=true;
                            //进度更新事件
                            that.audio.onTimeUpdate(() => {
                                for (var i = 0; i < that.audio.onTimeUpdateList.length; i++) {
                                    that.audio.onTimeUpdateList[i].func();
                                }
                            })
                        }
                    }) 

    2、在微信小程序使用audio.seek后,audio.onTimeUpdate监听失效,在onSeeked使用audio的属性例如paused、duration后恢复。

    方法1:在完成进度设置事件onSeeked中或onCanplay事件中使用audio.paused。

    //音频完成更改进度事件
                        audioBottomInfo.audio.onSeeked(() => {
                            console.log("onSeeked:"+audioBottomInfo.audio.paused); that.seek = false; })
  • 相关阅读:
    如何选择Html.RenderPartial和Html.RenderAction
    [转]使用 HTML5 WebSocket 构建实时 Web 应用
    基于.NET平台常用的框架整理
    0303
    XMLHTTP
    0120如何合并两个使用 System.Xml 使用 Visual C#.NET 的 XML 文档中的数据
    后台动态创建datatable0115
    笔记1126ASP.NET面试题(转)
    笔记1015
    数组与ARRAYLIST的关系与区别(转)
  • 原文地址:https://www.cnblogs.com/lanofsky/p/13986217.html
Copyright © 2020-2023  润新知