add_img(event){
let reader =new FileReader();
let img1=event.target.files[0];
let type=img1.type;//文件的類型,判斷是否是圖片
let size=img1.size;//文件的大小,判斷圖片的大小
if(this.imgData.accept.indexOf(type) == -1){
alert('請選擇我們支持的圖片格式!');
return false;
}
if(size>3145728){
alert('請選擇3M以內(nèi)的圖片!');
return false;
}
var uri = ''
let form = new FormData();
form.append('file',img1,img1.name);
this.$http.post('/file/upload',form,{
headers:{'Content-Type':'multipart/form-data'}
}).then(response => {
console.log(response.data)
uri = response.data.url
reader.readAsDataURL(img1);
var that=this;
reader.onloadend=function(){
that.imgs.push(uri);
}
}).catch(error => {
alert('上傳圖片出錯(cuò)!');
})
}
---------------------
版權(quán)聲明:本文為CSDN博主「小雷雷哥哥」的原創(chuàng)文章,遵循CC 4.0 by-sa版權(quán)協(xié)議,轉(zhuǎn)載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/leileibrother/article/details/79020758
vue上傳圖片
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
相關(guān)閱讀更多精彩內(nèi)容
- 最近Vue項(xiàng)目中,要將用戶上傳的圖片全部上傳到oss上,OSS配置項(xiàng)請?jiān)L問:https://help.aliyun...
- 這段時(shí)間公司再讓用vue做前端,在做一個(gè)圖片上傳功能,百度了半天,我們都知道base64是一個(gè)字符串 他的原理是通...
- 一個(gè)上傳頭像的功能,后端給的接口可以接收base64格式的,用的UI框架是vant-ui,需求和準(zhǔn)備大概就這樣,如...