<el-upload
:disabled="this.id== ''"
class="upload-demo"
style="display:inline;"
:action="uploadURLImg"
:show-file-list="false"
multiple
ref="upload"
:auto-upload="true"
:on-change="handleChangeImg"
:http-request="request">
<el-button style="background:rgb(86, 136, 171);color:#fff;margin-left:0px;">
批量上传图纸
</el-button>
</el-upload>
属性注解:
action: 必选参数,上传的地址
show-file-list: 是否显示已上传文件列表
multiple: 是否支持多选文件
ref: ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上
auto-upload: 是否在选取文件后立即进行上传
on-change: 文件状态改变时的钩子,添加文件、上传成功和上传失败时都会被调用
http-request: 覆盖默认的上传行为,可以自定义上传的实现
请求方法:
export const uploadFileRequest = (url, params) => {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
headers: { 'Content-Type': 'multipart/form-data' }
});
}
参考codePen演示地址: https://codepen.io/enjoykai/pen/WNwRXLK