1、上传输入框中定义一个changeImg方法
<input type="file" ref="upload" @change="changeImg" class="choosePhoto_upload">
2、封装一个转base64的方法
// 转换成base64方法
getBase64(file) {
return new Promise(function(resolve, reject) {
let reader = new FileReader();
let imgResult = "";
reader.readAsDataURL(file);
reader.onload = function() {
imgResult = reader.result;
};
reader.onerror = function(error) {
reject(error);
};
reader.onloadend = function() {
resolve(imgResult);
};
});
},
3、封装上传的接口方法
uploadBase (base64) {
var that = this
var uploadData = {
base64Str: base64
}
that.$axios
.post(host_klx + "/api/Sys/Upload", uploadData)
.then((res) => {
//返回数据
console.log(res)
})
.catch((err) => {
console.log(err)
});
},
4、触发上传方法以及调用转base64和请求接口
// 浏览本地图片
changeImg () {
// 获取文件
var file = event.target.files[0]
this.getBase64(file).then(res => {
this.uploadBase(res)
});
},
广州的冬天,不太冷…