使用uni.createInnerAudioContext()播放指定音频(踩坑分享功能)

步骤一:封装音频初始化函数,确保配置完整

javascript 复制代码
function initAudio() {
  const audio = uni.createInnerAudioContext()
  audio.src = '/static/music.mp3'
  audio.loop = true
  audio.obeyMuteSwitch = false
  audio.volume = 0.7

  // 监听错误(调试用)
  audio.onError((e) => {
    console.error('音频错误', e)
  })

  audioInstance.value = audio
}

步骤二:初始化调用

javascript 复制代码
 onMounted(() => {
      initAudio()
    })

    onShow(() => {
      // 页面显示时尝试恢复播放
      audioInstance.value?.play().catch(e => {
        console.log('播放被阻止,等待用户交互')
      })
    })

    onHide(() => {
      // 页面隐藏时暂停(不销毁!)
      audioInstance.value?.pause()
    })

    onUnload(() => {
      // 页面卸载时才销毁
      audioInstance.value?.destroy()
    })

 
相关推荐
傅科摆 _ py17 小时前
DP,贪心,堆和栈,二分力扣复习
开发语言·python·算法
kiracrimson17 小时前
栈与队列容器:适配器、deque 与 priority_queue
开发语言·c++·适配器模式
北冥you鱼17 小时前
Go 语言 CRUD 实战:从接口设计到真实业务场景
开发语言·后端·golang
郭小李18 小时前
springmvc 拦截器
java·开发语言·前端
程序员大阳18 小时前
副队长JavaScript教程(60)-BOM 初识:window 对象与浏览器模型
javascript·bom·window对象·浏览器模型
web打印社区18 小时前
Chrome-kiosk-printing能上生产吗
开发语言·前端·javascript·chrome·websocket
大风起兮云飞扬丶18 小时前
Java——日期类
java·开发语言
AIsoft_868918 小时前
职场音频文件怎么整理?录音APP有哪些用法
android·音视频
志尊宝18 小时前
AI原生前端开发(041):AI辅助的状态管理(Zustand/Pinia)
前端·javascript·ai-native
Wang's Blog18 小时前
Java 项目实战:交友项目 - 联系人管理需求分析
java·开发语言·交友