vue怎么拿到表单里的文件并从接口一起传给后端

Question

vue怎么拿到表单里的文件并从接口一起传给后端

<div class="layui-form-item layui-form-text">
    <label class="layui-form-label">订单号</label>
    <div class="layui-input-block">
        <input type="text" v-model="order" id="fileToUpload">
    </div>
</div>
<div class="layui-form-item layui-form-text">
    <label class="layui-form-label">截图上传</label>
    <div class="layui-input-block">
        <input type="file" id="fileToUpload">
    </div>
</div>


submitAfterForm(){
    let param = {
        orderId:this.order,
        img:'' //这里怎么拿到文件，并带过去啊...
    }
    $.ajax({
        type: "get",
        data: param,
        url: API.order.submitForm,
        dataType: "json",
        success: function(res) {
        },
        error: function(jqXHR) {
        }
    });
}

Answer 1

fileToUpload.files

重点是你需要传 formdata ，然后 append 进去。

Answer 2

input框上设置一个ref="getFiles"属性，点击后使用$(this.$refs.getFiles).prop('files');获取。