vue 文件上传的 图片上传 formData对象
页面html
<div class="form-item display-block height-auto">
<div class="name">上传凭证</div>
<div class="content">
<div class="upload-img">
<img src="/images/vue/wap-business-page/money-img.jpg" alt="">
<div class="upload-btn">
<input type="file" name="invoice" ref="invoice">
上传
</div>
</div>
</div>
</div>
<div class="post-btn-box">
<a class="rect-btn-full-blue" @click="submit">提交</a>
</div>
vue js文件
methods: {
submit(){
// 上传汇款凭证
let formData = new FormData();
formData.append('file', this.$refs.invoice.files[0]);
formData.append('identifier', 'invoice');
formData.append('identifier_type', this.order.identifier+'_invoices');
formData.append('table', 'business');
let config = {
'Content-Type': 'multipart/form-data',
};
this.axios.post('/api/common/attachment/store', formData, config).then((response) => {
if(response.data.errno == 0){
// 上传附件ID
this.businessInvoice.businessAttachmentId = response.data.business_attachment_id;
// 汇款支付
this.axios.post('/api/payment/remittance/' + this.orderId, this.businessInvoice).then((response) => {
if(response.data.errno == 0){
this.$router.push('/');
}else{
console.log('提交失败!');
}
});
}else{
console.log('上传失败!');
}
});
var businessAttachmentId = 0;
// 先上传图片
}
},
备注: 使用 js 模拟文件条件的方式进行文件 和图片的上传
formData = new FormData();