video 视频播放兼容安卓

H5 video标签，视频播放兼容安卓

<video src="images/aa.mp4"  controls="controls">
    <source  src="images/aa.mp4"  type="video/mp4">
 </video>

controls是video的播放控件，在iOS下，添加播放控件controls="controls"，就可以正常播放视频，但是在安卓下，播放控件的菜单加载出来是空白的，也就是说controls属性在安卓下是失效的。

兼容安卓需要单独配置一套代码：

<video src="images/aa.mp4"  controls="controls" v-if='nativeState'>
    <source  src="images/aa.mp4"  type="video/mp4">
 </video>
<video src="images/aa.mp4"  id='videoPlay2' ref='videoPlay2'  @click='videoBtn($event)' v-else>
    <source :src="el.applicationVideo" type="video/mp4">
 </video>

export default {
  data () {
    return {
      nativeState:''
    };
  },
  methods: {
  	videoBtn(e){
        var video1 = e.srcElement
        function requestFullScreen() { //全屏播放设置
            if (video1.requestFullscreen) {
                video1.requestFullscreen();
            } else if (video1.mozRequestFullScreen) {
                video1.mozRequestFullScreen();
            } else if (video1.webkitRequestFullScreen) {
                video1.webkitRequestFullScreen();
            }
        }
        if(video1.paused){
            video1.play();
            requestFullScreen(); 
        }else{
            video1.pause();
        }
    }
  },
  mounted() {
    var u = navigator.userAgent.match(/iPhone|iPad|iPod/i) ? true : false; //判断浏览器环境
    this.nativeState = u;
  }
  

注：如果点击播放按钮跳转了页面，有可能是设置全屏播放导致的。