关于微信小程序的video播放问题

需求:小程序首页有两个视频,视频标签上方覆盖本地图片一张;进入默认暂停,点击播放一个,另一个暂停。
 

wxml部分:

 
       
        
      
      
          
        
      

js初始默认:video1: false,video2: false,

问题:一开始我并不知道怎么设定视频的暂停与播放,误认为使用autoplay;但是这种在ios上面没有问题,在安卓上面会失效。安卓上初始进入视频就会默认同时播放。 

后来经过网上的查找,了解到可以用到:https://developers.weixin.qq.com/miniprogram/dev/api/media/video/VideoContext.html

关于微信小程序的video播放问题_第1张图片

我需要使用的是上面圈起来的几个方法。

示例:

var videoContext = wx.createVideoContext(‘video标签的id’)

videoContext.play();

js部分:

 video(e) {
    var that = this;
    var _index = e.currentTarget.dataset.id;
    var a;
    if (_index == 'video1') {
      a = 'video2'
      that.setData({
        video1: true,
        video2: false
      });
    } else {
      a = 'video1'
      that.setData({
        video2: true,
        video1: false
      })
    }
    //停止正在播放的视频
    var videoContextPrev = wx.createVideoContext(a)
    videoContextPrev.stop();
    videoContextPrev.pause();
    //将点击视频进行播放
    var videoContext = wx.createVideoContext(_index)
    videoContext.play();
  },

 

你可能感兴趣的:(微信小程序,微信小程序,video,播放)