el-upload上传时的file-List的基本用法

本文探讨了在使用Element UI的el-upload组件时,如何理解和使用file-List属性。重点在于file-List的name字段如何影响上传文件的显示名称,并讨论了如何在上传过程中实现文件重命名。同时,文章指出,若希望保留原始文件名,可以不使用file-List,而通过'on-success'钩子来处理。对于在服务器端保存时修改文件名,需要确保服务器支持接收参数并进行命名,可以通过指定url参数实现。
摘要由CSDN通过智能技术生成

关于el的file-List用法官网有写,但是一直搞不懂的时url到底是什么地址,跟上传地址有什么区别。

于是百度下,有人这么写,意思是url就是文件的地址。难道官网的url就是网上图片的地址?有人问了,那要是本地地址呢,这个url怎传?

html:

<el-upload
  action="https://192.168.1.1:8888/xxx上传接口"
  :file-list="fileList"
  <i class="el-icon-plus"></i>
</el-upload>

vue/js:

data(){
	return{
		fileList: []
	}
}
methods:{
	update(){
		fileList.push({name: "123.jpg"  url: "图片地址"})

	}
}

-------------------------------------割--------------------------------------------------------------------最后问题来了,url到底时什么地址?

在点击选择文件时@change,就已经发请求了,后端会给我文件服务器的上传路径(https://192.168.1.1:8888/上传接口 )+ 会给一个唯一名称值给我(当然前端也可以自己生成,但是后端要做记录,所以它就自己生成了),这时后端传过来的就有了上传接口,我绑定在了:action中。哪个唯一值我就放在fileList的name中࿰

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值