vue锁屏或进入后台关闭背景音乐

1.首先,参考https://www.jianshu.com/p/813e491177a5
添加背景音乐
2.在mouted方法中加如下方法 在页面被挂起时停止播放,唤起时播放

  document.addEventListener("visibilitychange",() => {
       if (document.hidden) { //网页被挂起
           _this.musicStart = false
           _this.changeMusicPlay()
       } else { // 网页被呼起
           _this.musicStart = true
           _this.changeMusicPlay()
       }
   })

其中musicStart 在data中定义。默认为false,changeMusicPlay方法如下:

  /* 开始/暂停播放音乐 */
    changeMusicPlay() {
        this.musicStart = !this.musicStart
        if (this.musicStart) {
            this.$refs.music.pause()
        } else {
            this.$refs.music.play()
        }
    },