Element-UI与Iview中的多个图片预览并通过点击事件上传

要完成通过点击事件统一上传图片,并后台要求图片以数组格式传给后台,但是Element-UI与Iview的文档中只有直接上传并且是单个图片上传的例子,所以在这里自己做个笔记,以防止以后会用到:下面是已经做完的实例

下面是用的iview写的,用element-ui也可以完成;

图片预览的时候,是可以点击查看图片并删除的,所以这里有2个事件(点击预览和删除),另外上图中的uploadList这个只是用来保存预览图片的,并不是上传图片的

当然对应的模态框的设置和样式如下:

好了  样式到此为止,接下来是上传的问题,首先要在Form表单中设置好上传文件的属性

然后在点击上传按钮的时候

最后通过点击确定按钮,发给后台

最后通过点击确定按钮,发给后台

就可以把多个图片以数组的形式统一上传了

评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值