element-ui upload组件 on-change事件 传自定义参数
2023-03-15 14:17:18
357次阅读
0个评论
项目中有一个功能,要支持同时创建1到多个相同的模块,每个模块对应自己的上传文件,同时文件上传为手动上传。
通过 on-change 钩子函数来对每块的文件列表进行控制,需要知道当前操作模块的序号,这就要添加一个index的自定义参数
templateForms = [
{templateId:'',templateContent:'',fileList:[]}
];
<template v-for="(item,index) in templateForms">
<el-form-item label="选择短信模板:" prop="template">
<el-select v-model="item.templateId ">
<el-option
v-for="tem in templates"
:key="tem.value"
:label="tem.text"
:value="tem.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="短信预览:">
<el-input type="textarea"
v-model="item.templateContent"
:rows="5"
readonly></el-input>
</el-form-item>
<el-form-item label="接受号码上传:">
<el-upload
action=""
accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
:auto-upload="false"
:file-list="item.fileList"
:on-change="(file, fileList) => {handleChange(file, fileList, index)}"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
</template>
handleChange(file:any,fileList:any[],index:number){
console.log(file,fileList,index);
this.templateForms[index].fileList = fileList;
}
00
- 0回答
- 1粉丝
- 0关注
相关话题
- SpringBoot自定义配置文件及读取配置文件
- SpringBoot从application.yml中获取自定义常量
- element UI中el-row垂直居中
- Vue3.2 setup语法糖中组件的 name 属性如何定义
- Fabric.js 事件
- FFmpeg的ffprobe参数
- vue2 动态组件
- Nginx 根据URL请求参数转发
- 前端图片压缩与上传OSS组件
- Java匿名内部类赋值给外部参数
- 在 element 页面滚动时,顶部 menu 栏遮住字体时会变成像素点
- nginx 多组件安装及secure_link配置与文件下载防盗链的使用
- hls播放m3u8 添加header请求头,在请求ts的url上添加参数