前端上传图片，后台识别不到file对象

Question

前端上传图片file对象什么的都可以打印出来，但是后台就是识别不到file对象
上传图片的代码如下

<template>

  <div class="upload">

    <div class="upload_warp_upload">

        <span v-for="(item,index) of imgList" class="upload_span">

           <img :src="item.url">

            <span @click="fileDel(index)" class="upload_del"></span>

        </span>

        <div class="upload_warp_left" @click.stop="fileChange">

          <span>＋</span>

        </div>

      </div>

      <input accept="image/*"

             @change.stop="fileChange($event)"

             type="file" id="upload_file" style="display: none"/>

    </div>

  </div>

</template>

<script>

  export default {

    data(){

      return {

        imgData:[],

        imgList: [],

        size: 0,

      }

    },

    methods:{

        fileClick() {

          document.getElementById('upload_file').click();

        },

        fileChange() {

            let reader = new FileReader();

            let file = e.path[0].files[0];

            reader.readAsDataURL(file);

            let that = this;

            reader.onloadend = function () {

              let url = reader.result;

              that.imgList.push({url: url, name :file.name});

              that.$messageBox('成功');

              that.imgData.push(file);

              that.$emit('imageListChange', that.imgData);

            };

        },

        fileDel(index) {

          this.imgList.splice(index, 1);

        },

      }

  }

</script>

前端打印出来的file对象

network中的数据：

各位大神啊~这是咋回事啊，我已经接近崩溃了

Answer 1

得通过name属性来获取file对象把

Answer 2

我看你直接把file，push到imgData里面了。每次上传文件到后台，我的做法是var formData = new FormData();formData.append('file' , files[i]);然后ajax,直接把formData 传给后台，这样后台就可以识别file。

Answer 3

哈哈哈哈哈~~~ 打死后台