方法一:
使用formData
提 交
// 创建formdata对象
handlePreview(e) {
this.formData = new FormData();
this.formData.append("file", e.target.files[0]); // file就是后台给的字段
},
// 上传提交
submit() {
this.$axios
.post("/api/file/uploadFileToAliyun.json", this.formData)
.then(({ data }) => {
this.info.pic = data;
this.dialogVisible = false;
});
},
方法二:
使用el-upload
action="/api/file/uploadFileToAliyun.json"
list-type="picture-card"
:on-success="handleSuccess"
>
action:请求接口的地址
:on-success:上传成功后的回调,第一个参数是接口返回的数据
handleSuccess(url) {
this.info.pic = url;
},
url代表接口返回的图片地址,这里后台直接返给我url了
这里只是把图片上传了,但是还需要调用一下保存(更新)的接口