elementUI el-upload自定义参数

  • Post author:
  • Post category:其他


很多场景下,页面使用到多个el-upload组件,这个时候element并没有提供类似this的这么个东西,钩子函数的回调里面定位不到当前组件,可以通过以下两种方式获取到当前组件。



elementUI 提供的Upload 没有自定义回调参数可以通过以下两种方式实现



方法一: data传参,官网提供的data方式

在这里插入图片描述

具体写法为

	<el-upload
     :show-file-list="true"
      list-type="text"
      accept="image/*"
      :data="{index:index}"
    >
      <el-button size="mini" type="primary">上传图片</el-button>
    </el-upload>

这种方法会把data里面的参数放在请求体里面,需要后台童鞋配合,实现起来比较麻烦。



方法二::on-success=”(value)=> handleSuccessImg(index, value)”

通过回调方式获取,将要传入的index值写进on-success方法里面,改成:on-success=”(value)=> handleSuccessImg(index, value)”

 <el-upload
   :show-file-list="true"
    list-type="text"
    accept="image/*"
    :file-list="item.headImgList"
    :action="computedUploadImgUrl"
    :with-credentials="true"
    :on-success="(value)=> handleSuccessImg(index, value)"
    class="uploader"
  >
    <el-button size="mini" type="primary">上传图片</el-button>
  </el-upload>

如有问题请联系我~

欢迎加入QQ群:

在这里插入图片描述



版权声明:本文为qq_37617413原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。