uniapp 背景音乐播放/暂停

<view class="bj_music" @click="bjMusicClick">
    <image :class="!musicShow?'musicStyle':''" src="../../static/img/music_icon.png" mode="widthFix"></image>
</view>
.bj_music image{width: 72rpx;height: 72rpx;}
.bj_music .musicStyle{animation: bjMusic 3s linear infinite;}
const innerAudioContext = uni.createInnerAudioContext();
export default {
    data() {
        musicShow:true
    },
     onl oad(){
        innerAudioContext.autoplay = true;
      innerAudioContext.loop=true; //循环播放
      innerAudioContext.src ='https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3';
      this.musicShow=false;
    },
    methods: {
      bjMusicClick:function(){
          if(this.musicShow){
              console.log('播放')
              innerAudioContext.play()
          }else{
              console.log('暂停')
              innerAudioContext.pause();
          }
          this.musicShow=!this.musicShow;
      }
    }   
}

 

上一篇:第六次网页前端培训笔记(HTML)


下一篇:JavaStudy09 break;continue