H5上傳圖檔
前端事件我碰見了最常見的評論上傳(實作預覽,上傳,删除)功能,就整理了一下代碼。弄了一個相對比較見簡單的功能 。
新增操作(把擷取的img路徑存儲起來) 再向伺服器上傳換取線上路徑
changeimage(event) { //新增操作
var inmgbase64;
this.getObjectURL(event.target.files[0]).then((res) => {
inmgbase64 = res;
let myformdata = new FormData()
myformdata.set('data', inmgbase64); //看後太是否需要formdata
//請求接口
})
},
getObjectURL(file) {
return new Promise((resolve) => {
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function(e) {
resolve(e.target.result);
}
});
}
效果圖