Vue—实现文件上传（多文件），图片上传

一、图片上传

//template
              <input
                type="file"
                accept="image/*"
                @change="changeImage()"
                ref="avatarInput"
                style="display:none"
              />
              <div class="pic_list">
                <div v-for="(src, index) in imgDatas" :key="index">
                  <!-- 利用element-ui的图片预览插件 -->
                  <el-image
                    style="margin-right: 10px;width: 100px; height: 100px"
                    :src="src"
                    :preview-src-list="imgDatas"
                  >
                  </el-image>
                </div>
                <!-- 替换自己的上传图标 -->
                <p class="upload_btn" @click="upLoad">＋</p>
              </div>
//script
data(){
   
	return {
   
      	formData: new FormData(),
		imgDatas:[]
	}
},
methods:{
   
	changeImage() {
   
      // 上传图片事件
      var files = this.$refs.avatarInput[0].files;
      var that = this;
      if (files.length === 0) {
   
        return;
      }