使用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()
    })

 
相关推荐
mayaairi22 分钟前
JS BOM完全指南(二):事件轮询、三大尺寸家族与浏览器对象详解
开发语言·javascript·ecmascript
technology_x29 分钟前
液冷超充站设备厂家哪家好?2026年功率与散热对比
java·开发语言
SurpriseDPD34 分钟前
bpftrace‑tasks 工具代码分析
开发语言·python
bj_bluewei_tech41 分钟前
拯救者外接耳机麦克风没声音,更换耳机无效,排查主板音频信号电路
电脑·笔记本电脑·音视频
千谦阙听1 小时前
C++篇:类和对象(上)
开发语言·c++
许彰午1 小时前
07-SqlBuilder六法
java·开发语言·低代码·架构
BS30813_vx1 小时前
【编号:01652】Spring Boot村务管理系统:财务公开、党建活动与计生服务一体化实战
开发语言·python
Jul1en_1 小时前
【Java 脚手架】封装通用工具类-3
java·开发语言·redis·缓存·ai·bootstrap·rabbitmq
学习星球1 小时前
2026年AI Agent全栈开发实战——从Prompt到Production
开发语言·人工智能·prompt
Fluxart.ai2 小时前
商品多角度图怎么做?Flux Art 从白底图到规格图、包装图的 10 步教程
开发语言·前端·javascript