使用elemtn ui 的upload组件 让非自动上传也能显示预览视频

 <el-upload
        class="avatar-uploader el-upload--text"
        action=""
        :auto-upload="false" //关闭自动上传 
        :show-file-list="false" //关闭上传显示列表
        :on-change="getFile"  //加入文件触发事件
        :on-remove="handleRemove" //删除事件
        accept=".mp4"  //只接受mp4
        :limit="1"   //1个
        drag  //拖动许可
        style="margin-top:50px" 
      > 
         <i class="el-icon-upload"></i>
  <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
  <div class="el-upload__tip" slot="tip">只能上传MP4文件，且不超过50MB</div>
      </el-upload>

//上传变化事件
    getFile(file, fileList) {
      let fileType = [".mp4", ".MP4"];
      let { name, size } = file;
      let hzIndex = name.lastIndexOf(".");
      let nameLen = name.length;
      //获取后缀名
      let hz = name.substring(hzIndex, nameLen);
      let videoSize = parseFloat(size) / 1024 / 1024 > 50; //限制上传视频的大小  
      if (!fileType.includes(hz) || videoSize) {
        console.log(this.ItemPicList);
        this.$message.error({
          message: "注意:视频格式需要为50MB以下的MP4文件！",
        });
        // this.handleRemove(file,fileList)
      } else {
        //下面两行用于获取临时路径 用于给浏览器预览视频
        let URL = window.URL || window.webkitURL;
        this.AUDIO = URL.createObjectURL(file.raw); /用这个赋值给需要的视频组件就行 就能显示本地视频了
        console.log(this.AUDIO);
        // 获取视频 至于上传  给后端raw就行
        //this.hideUpload = fileList.length >= 3;
        this.getVideFile(file.raw).then((res) => {
        });
      }
       this.video = [1]
    },