element之el-upload上传excel文件

前言：

el-upload是一个封装好了的input type：file的上传组件，这个组件封装的非常好，从选择文件到上传封装了一套钩子函数，可以监听他选择文件之前到上传文件之后的事件，我们可以在对应的钩子函数里面进行操作；

需求：

1.点击导入题库出现弹框

2.弹框包含多选题目类型，上传文件功能（选择文件完成出现文件信息，点击右上角"x"可以取消上传此文件）

3.导入excel文件（点击“a”标签下载模板）

具体实现

具体代码

实现：

accept: 可过滤文件信息，选择文件默认只能选择.xls文件

action：为请求服务器的地址，就点击上传选择文件就会直接调用这个方法把文件传过去；

data：附带默认参数，对象的形式

:file-list:文件列表信息，可多个文件显示

multiple：设置是否可多选

limit:设置具体几张

http-request：覆盖默认上传行为，自定义上传（在这里我用的是自定义上传，他封装的这个需要与服务器把具体对接好，不然接收不到文件）

solt=tip：封装的solt插槽，就是选择文件下方的小提示，我这里是让其点击下载模板；

下拉选项的方法及选择文件的方法

1.下拉选项选择的时候拿到他的id[1,2,3],通过join（）方法将其转换为后台需要的格式1,2,3

2.http-request的方法，在这里选择完文件就可以直接上传，但由于我是要携带下拉选择的参数，所以这边我只是拿到他的文件名，通过点击确认的时候在调用后台接口，将数据发送给后台

提交文件

1点击确认时先判断他是否存在需要的两个参数，如果为空则给出提示

2.当都不为空时调用后台接口，创建一个FormData对象。通过append()方法将参数加进去

3.如果请求成功才关闭弹窗，并给出提示（error已去掉...）

4.失败则抛出服务器给出的异常，