el-upload组件一些坑

真的是比较懒于写博文，下面来说一下el-upload组件在使用中遇到的一些坑：

1. 原el-upload组件使用 :http_request 来绑定自定义上传函数，如何不通过按钮而是在完成一些操作以后自动触发上传事件呢？
   答： 使用 :on-change 绑定一个方法，该方法携带参数（file, fileList）, 在文件状态改变时调用，即在选中文件后，上传文件成功，上传文件失败时都会调用，在这个方法内完成文件上传前的操作之后，使用this.$refs.upload.submit() 完成上传组件自定义上传方法的调用；当然，前提是在使用<el-upload>组件时在其中定义了 ref= upload 的属性。

2. <el-upload>组件自带的上传操作，action定义默认上传的接口，同时可以通过 :data=XXX 进行默认上传携带额外参数的定义，但是不能通过 this.refs.upload.data 操作在文件上传之前进行data属性的设置。
   解释： 正确来说，是可以修改成功的。控制台打印 this.$refs.upload.data 的确是可以打印出设置的正确值，但是控制台查看触发的默认上传操作，却无法正确设置每一次上传的携带的额外参数值。（具体原因不详，但是感觉是异步操作的原因。data属性在有定义的初始值，在 on-change 绑定的方法中重新设置的额外参数，但没有立即生效，而是等到下一个文件上传才生效）

具体代码：

<el-upload
                    ref="upload"
                    :action="fileAction"
                    :headers="myHeaders"
                    :data="type"
                    drag
                    :auto-upload="false"
                    accept=".apk, .zip, .rar"
                    :file-list="fileList"
                    :http-request="uploadFile"
                    :on-error="uploaderr"
                    :on-success="succe"
                    :on-change="handleExceed">
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                <div class="el-upload__tip" slot="tip">上传应用新版本即可自动获取下载链接（只限于apk, rar, zip文件）</div>
            </el-upload>

数据：
            type: {type: 'apk'}

   //选择文件时会替换掉上一个文件 状态改变的钩子
            handleExceed(files, fileList) {
                if(files.name.indexOf(".zip")>0){
                    //this.type =  "zip"
                    this.$refs.upload.data= {types: "zip"}
                    console.log("上传组件自定义参数",this.$refs.upload.data)
                    //this.$refs.upload.submit();
                }
                else if(files.name.indexOf(".rar")>0){
                    //this.type = "rar"
                    this.$refs.upload.data = {types: "rar"}
                    console.log("上传组件自定义参数",this.$refs.upload.data)
                    //this.$refs.upload.submit();
                }else if(files.name.indexOf(".apk")>0){
                    //this.type = "apk"
                    this.$refs.upload.data = {types:"apk"}
                    console.log("上传组件自定义参数",this.$refs.upload.data)
                    //this.$refs.upload.submit();
                }
                this.fileList = fileList.slice(-1);
            },

当我选择的文件后缀是.zip时，控制台查看到的请求携带的参数还是 apk(初始设定值)，当我继续选择一个rar文件时，控制台查看的携带参数是zip,而不是rar....

所以我最终选择了自定义上传方法。