版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/haeasringnar/article/details/82351618
1、html代码
<img src="" alt="" id="myimg">
<input type="file" name="fileToUpload" id="fileToUpload"
@change='changeimage($event)'>
注意这里面定义的方法changeimage
2、script代码写在methods里面
getObjectURL(file) {
var url = null ;
// 下面函数执行的效果是一样的,只是需要针对不同的浏览器执行不同的 js 函数而已
if (window.createObjectURL!=undefined) { // basic
url = window.createObjectURL(file) ;
} else if (window.URL!=undefined) { // mozilla(firefox)
url = window.URL.createObjectURL(file) ;
} else if (window.webkitURL!=undefined) { // webkit or chrome
url = window.webkitURL.createObjectURL(file) ;
}
return url ;
},
changeimage (event) {
// 调用上面的方法
var objurl = this.getObjectURL(event.target.files[0])
console.log(objurl)
$('#myimg').attr('src',objurl)
}