vue elementui 上传视频（图片上传改造）

          <el-form-item label="上传视频" prop="videoUrl">   

            <el-upload
            class="avatar-uploader"
            :action="actionUrl"
            :show-file-list="false"
            :on-success="handleVideoSuccess"
            :before-upload="beforeUploadVideo"
            >
            <video v-if="form.videoUrl1" :src="form.videoUrl1" class="avatar"></video>
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
              <p v-if='load'> 上传中</p>
               <P style="color:#000000">请保证视频格式正确，且不超过20M</P>

            </el-upload>
            
          </el-form-item>

// 上传视频
//上传前限制大小
            beforeUploadVideo (file) {
            const isLt20M = file.size / 1024 / 1024 < 30;
            if (['video/mp4'].indexOf(file.type) == -1) { //'video/ogg', 'video/flv', 'video/avi', 'video/wmv', 'video/rmvb'
                this.$message.error('请上传正确的视频格式');
                return false;
            }
            if (!isLt20M) {
                this.$message.error('上传视频大小不能超过20MB哦!');
                return false;
            }
            this.isShowUploadVideo = false;
            this.load=true;
        },

	
	//上传成功回调
	handleVideoSuccess (res, file) {
            this.form.videoUrl1 = URL.createObjectURL(file.raw);
            this.form.videoUrl = res.data;
             
            
            if (res.code == 1) {
              this.load = false;

                
            } else {
                this.$message.error('视频上传失败，请重新上传！');
            }
              
  },

参考饿了吗ui的图片上传