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

 
相关推荐
hello 早上好12 小时前
05_Java 类加载过程
java·开发语言
PPPPPaPeR.12 小时前
光学算法实战:深度解析镜片厚度对前后表面折射/反射的影响(纯Python实现)
开发语言·python·数码相机·算法
echoVic12 小时前
多模型支持的架构设计:如何集成 10+ AI 模型
java·javascript
橙露12 小时前
Java并发编程进阶:线程池原理、参数配置与死锁避免实战
java·开发语言
froginwe1112 小时前
C 标准库 - `<float.h>`
开发语言
echoVic12 小时前
AI Agent 安全权限设计:blade-code 的 5 种权限模式与三级控制
java·javascript
David凉宸12 小时前
Vue 3 + TS + Vite + Pinia vs Vue 2 + JS + Webpack + Vuex:对比分析
javascript·vue.js·webpack
AI资源库12 小时前
Remotion 一个用 React 程序化制作视频的框架
人工智能·语言模型·音视频
2501_9160088912 小时前
深入解析iOS机审4.3原理与混淆实战方法
android·java·开发语言·ios·小程序·uni-app·iphone