element图片上传，我总共摸索了几天，才大体上把它搞清。写完之后一段时间不去管它，又会忘记得一干二净，所以记录下来:
我们写图片上传首先要想好几个问题：
1、自动上传还是手动上传？？
2、多图上传还是单图上传？？（我都用了，现在只想记录多图得情况）设置: :multiple="true"
3、什么时候用on-change，什么时候用before-upload
一、关于自动和手动，我们都知道，设置auto-upload="true"就是自动上传，这个参数非必要，我不填写应该默认就是自动上传。action="上传图片的接口"这样就能实现自动上传了，但是我这个人比较懒，不想在里面拼全地址，加上我axios已经封装好了，然后就用http-request里面调上传的接口，设置auto-upload="true"，http-request里面自动就会执行。以下是我的示例代码：
<el-upload
ref="upload"
:multiple="true"
:show-file-list="true"
:limit = "9"
:file-list="imgFiles"
:on-remove="handleRemove"
:on-success="handleSuccess"
:before-upload="beforeAvatarUpload"
:headers="headers"
class="editor-slide-upload"
:action="''"
list-type="picture-card"
:http-request="handelUpload"
>
<i slot="default" class="el-icon-plus"></i>
</el-upload>
二、多图上传的两种模式：
1.多图上传之自动上传
以上是自动上传，但是性质是多图上传，我可以按住ctrl一次选中多张图片，但是在上传的时候，图片仍然是一张一张的传过去的。如下图：
请求了三次接口，我这里是表单提交，在上传成功后把图片放入json数组中。
上传成功以后右上角会有一个绿色的对勾（ √ ）
有对勾是因为我在
on-success的时候将上传成功的文件:file-list="imgFiles"中imgFiles添加进去了。
2.多图上传之手动上传
直接放示例代码：
<el-upload
ref="upload"
:multiple="true"
:show-file-list="true"
:on-remove="handleRemove"
:on-success="handleSuccess"
:auto-upload="false"
:headers="headers"
:limit = "9"
:on-change="uploadSectionFile"
class="editor-slide-upload"
action="''"
list-type="picture-card"
>
<el-button size="small" type="primary">
点击上传
</el-button>
</el-upload>
这个图片上传的模式跟之前的不同，我这里直接是在选中多张图片以后请求接口，也就是多张一起传，点击上传按钮才执行上传的操作。其实这里是不需要用到http-request的，在:auto-upload="false"的时候
http-request并不会自动执行，如果想在里面写请求的方法，可以在点击按钮的时候执行http-request,或者this.$refs.upload.submit()
三、on-change和before-upload
我认为，在多图上传，但是模式是自动上传的时候（即图片一张一张的传），用before-upload去操作图片压缩之类的事情；
在多图上传手动触发的时候用on-change比较好
on-change有时候跟before-upload是差不多的，但是有时候on-change在上传成功和上传失败的时候会触发，写完代码过去好几天了，已经不记得这种情况。
on-change的file有raw属性，而before-upload的file没有raw属性
补充：
http-request别人说有一个隐藏的参数，其实并不然，before-upload中resolve(data)有值并且传对了，他才能接收一个参数例httpRequest(file) file才能接收得到
