ElementUI的Upload组件上传时如何携带参数

Upload组件上传时如何携带参数

今天在写文件上传时,想要在上传的时候携带参数.
由于对前端代码不太熟悉,也踩了很多坑,在此写出自己的见解,如果有什么不对的地方,希望大家及时指出.

起初的想法是直接在action后面加上需要传递的参数,如下

<el-upload
	class="avatar-uploader"
	<!--直接在url后面写参数-->     
	action="/setmeal/updatePicture.do?pictureName"+this.imageName
	:auto-upload="autoUpload"
	name="imgFile"
	:show-file-list="false"
	:on-success="handleAvatarSuccess"
	:before-upload="beforeAvatarUpload">
</el-upload>

试过之后在发现根本行不通,后来去网上查了很多资料,经过多番尝试之后终于成功
原来可以直接使用 :data={参数} ,参数为键值对的形式{key1:value1,key2:value2},传递参数,如下

<el-upload
	class="avatar-uploader"
	action="/setmeal/updatePicture.do"
	:data={pictureName:this.imageName}
	:auto-upload="autoUpload"
	name="imgFile"
	:show-file-list="false"
	:on-success="handleAvatarSuccess"
	:before-upload="beforeAvatarUpload">
</el-upload>

这样就可以在上传文件,访问后端时携带参数
ElementUI的Upload组件上传时如何携带参数_第1张图片

你可能感兴趣的:(前端)