使用 vue 和element ui组件做上传图片功能

实现目标：上传本地图片到页面的指定位置，

  <el-upload  ref="upload" class="avatar-uploader" :file-list="fileList" :show-file-list='false' list-type="picture" :action="uploadUrl" name="imgFile[]" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload" accept="image/*" :limit="10">
          <button class="btn" type="primary">上传附件button>
           <span slot="tip" style="color:#999; line-height:20px">支持png、jpg、jpeg格式的图片，最多10张,单个文件最大限制5Mspan>
   el-upload>
   <div class="img-box" v-for="(item,index) in form.rec_url" :key="index">
 		  <img :src=" baseApi+item" class="avatar">
    div>

const baseApi = process.env.BASE_API;
export default {
     
    data() {
     
   	 	return {
     
   			 baseApi:baseApi,
   		     fileList: [],
   		     uploadUrl: baseApi + '上传地址'
   			 form:{
     
   			 		rec_url:[]
    			},
		  }
	},
	methods: {
     
    	 handleAvatarSuccess(response, file, fileList) {
     
   		      let path = response.data
   		      this.form.rec_url.push(path[0])
   	  	},
	}
 }