vue框架input框上传图片文件实时显示


body部分:

上传图片<input type="file" ref="file2" name="check_img_url" @change="tirggerFile($event)" />
<div>
                <img style="width:100px;height:100px;margin-left:105px" id="img2" src alt />
</div>
script部分:
methods:{
    tirggerFile(event) {
                var file = event.target.files;
                var reader = new FileReader();//读取文件
                reader.readAsDataURL(file[0]);
                reader.onload = function() {
                    document.getElementById("img1").src = reader.result;
            };
        },
 
}


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM