element-ui el-upload 组件 Attribute传自定义参数

最新推荐文章于 2024-04-25 14:01:49 发布

我总是词不达意

最新推荐文章于 2024-04-25 14:01:49 发布

阅读量769

点赞数 1

分类专栏： element-ui 前端 vue 文章标签： elementui vue.js 前端 javascript html5

本文链接：https://blog.csdn.net/weixin_43743175/article/details/124932825

版权

前端同时被 3 个专栏收录

86 篇文章 3 订阅

订阅专栏

vue

46 篇文章 1 订阅

订阅专栏

element-ui

16 篇文章 1 订阅

订阅专栏

element-ui el-upload 组件 Attribute传自定义参数，具体可以参考如下：

<el-upload
  ref="upload"
  :action="shortVideoUrl"
  :headers="importHeaders"
  :on-preview="(file) => {onHandleImgPreview(file, index)}"
  :on-change="(file) => {onHandleChange(file, index)}"
  :on-remove="(file) => {onHandleRemove(file, index)}"
>

完整传递全部参数例子

其他事件参数请参照element-ui官网Upload 上传组件，传送门

:on-preview="(file) => {onHandleImgPreview(file, index)}"
:on-change="(file, fileList) => {onHandleChange(file, fileList, index)}"
:on-remove="(file, fileList) => {onHandleRemove(file, fileList, index)}"
:on-success="(response, file, fileList) => {onHandleSuccess(response, file, fileList, index)}"

其中index为需要用到的自定义参数

onHandleImgPreview、onHandleChange等为对应事件方法

onHandleImgPreview(file, index){
  console.info(index)//自定义参数
  console.info(file)
},
onHandleChange(file, fileList, index){
  console.info(index)//自定义参数
  console.info(file, fileList)
  
},
onHandleRemove(file, fileList, index){
  console.info(index)//自定义参数
  console.info(file, fileList)
}

onHandleSuccess(response, file, fileList, index){
  console.info(index) //自定义参数
  console.info(response, file, fileList)
}