input选择视频或图片本地预览问题

图片目前可以用两个方法，示例是vue代码，原生用的话需要小改下

预览图片 1
    
     
 
    chooseImgInput(event) { //选择图片加载到图片裁剪工具里
        var that = this;
 
        var files = document.getElementById("filepicker").files[0];
        this.fileName = files.name;
 
        var reader = new FileReader();
        reader.readAsDataURL(files);
            reader.onload = function(e) {
            that.visible = true;
            that.imgUrl = this.result;
        }
 
    },
 

预览图片 2
    
     
 
    chooseImgInput(event) {
        var files = document.getElementById("filepicker").files[0];
        var url = URL.createObjectURL(files);
        this.imgUrl = url;
    },
 

预览视频 
    
    
 
    chooseVideoInput(event) {
        var files = document.getElementById("filepicker").files[0];
        var url = URL.createObjectURL(files);
        this.video_url= url;
    },
 
    
    :controls="controls" x5-playsinline="" playsinline="" webkit-playsinline preload="auto"
    //这几个属性是解决原生视频video标签在ios手机上自动去安平播放的问题，controls是是否显示控制栏
 
--------------------- 
作者：jw19950424 
来源：CSDN 
原文：https://blog.csdn.net/jw19950424/article/details/79974589 
版权声明：本文为博主原创文章，转载请附上博文链接！