Vue中使用axios以FormData形式提交数据
这算是接上篇所写吧,上篇在上传图片的时候,要传给后端图片文件的blob对象,这个时候就得使用FormData的方式提交了,其实也是蛮简单的一个东西了,就直接上代码了
// 表单提交 doSubmit() { this.$refs["inputForm"].validate((valid) => { if (valid) { if(!this.inputForm.img) return this.$message.warning(请选择图片) this.loading = true let formData = new FormData() const { id, dataCenterId, buildName, state, buildCount, buildDesc, img } = this.inputForm formData.append("id", id) formData.append("dataCenterId", dataCenterId) formData.append("buildName", buildName) formData.append("state", state) formData.append("buildCount", buildCount) formData.append("buildDesc", buildDesc) formData.append("img", img) //继承自Blob的二进制大对象 this.$http({ url: wft/fromsave, method: post, headers: { Content-Type: multipart/form-data }, data: formData }).then(({ data }) => { if(data && data.success) { this.$message.success(操作成功) } }) } }) }
一篇大哥的博文介绍了FormData的作用及用法: