uniapp技巧-设置背景音乐

最近有个uniapp有个设置背景音乐的需求，查了一些资料，想通过通用组件实现，无奈页面太多。最后终于找到了可以不用挨个页面修改的方法，并且在使用过程中发现了该方法中未能说明的地方自己做了补足，记录一下。

1、app.vue设置背景音乐组件

onLaunch: function() {

this.bgmMusic = uni.createInnerAudioContext();

this.bgmMusic.autoplay = true;//自动播放

this.bgmMusic.loop = true;//循环播放

this.bgmMusic.src = '../static/audio/bg.mp3';//背景音乐地址

this.bgmMusic.volume = 0.3;//音量

this.bgmMusic.onPlay(function(){

console.log('背景音乐播放中');

});

},

2、其他需要停止的page中可以设置停止

这里有个地方需要注意获取app.vue中的对象使用getApp()方法

onLoad() {

this.bgmMusic = getApp().bgmMusic;

this.bgmMusic.stop();

this.bgmMusic.onStop(()=>{

console.log('背景音乐停止了');

});

},

参考资料：

https://blog.youkuaiyun.com/weixin_45324044/article/details/108463019

https://uniapp.dcloud.io/api/media/audio-context

https://ask.dcloud.net.cn/question/79033