微信小程序 - 音频播放进度条和点击拖动的控制，支持自定义音乐播放控件样式布局（wx.createAudioContext）解决各种 InnerAudioContext.onTimeUpdate不执行

前言

网上有很多关于 InnerAudioContext.onTimeUpdate 不执行、失效的问题，都导致播放进度条无法做了，本文完美解决。

在微信小程序开发中，详解自定义播放音频控件样式，且支持播放进度条显示及控制，完美解决了所有 “进度条问题” ，实现拖拽滑动进度条控制、暂停播放、开始播放、离开页面回来后依旧正常、重播进度拖拽等操作，可用于音频播放音乐播放器开发与展示场景，自定义进度条样式和控制按钮等，提供详细示例源码。

小程序 vue2 | vue3 版本语法都能使用，跟着教程复制代码运行即可。

---

如下图真机所示，苹果安卓真机测试丝滑流畅，修改成自己想要的样式，然后再改个音频文件路径即可。

详细示例代码及注释，保证新手小白100%搞定。

示例代码

具体实现代码如下，请直接复制运行测试即可。