vue 文件上传的 图片上传 formData对象

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();