Upload文件上传
iceui内置了多种方式的文件上传,如下。
单文件上传
这是传统的通过input方式上传
单图片上传,带缩略图
这是异步方式上传,与上面的示例使用区别在于不用写input,但必须要指定name和url值,具体请看文档说明。
单图片上传,也可以提前放置缩略图
单文件上传,点击或拖拽上传
多图片上传
自带缩略图展示,可自定义上传图片的格式
多图片上传-回显图片
自带缩略图展示,可自定义上传图片的格式
多附件上传
自带存储大小,可自定义上传附件的格式
单文件上传
这是原生最普通的一种input方式,以同步的方式提交,只不过被美化了,如果想要使用异步,把input标签删掉就行了,但必须要指定data-name和data-url的值,具体请看下面的data属性值设置列表与代码示例。
单文件上传,开启缩略图
如果想要开启缩略图的话,只需要添加一个data-img="true"属性即可
单图片上传,预放置缩略图
单文件上传,点击或拖拽上传
多图片上传
该方式采用异步上传,必须指定上传的url连接
多图片上传-图片回显
编辑资料中往往会用到回显,也就是上传了什么图片,显示在列表中
多附件上传
该方式采用异步上传,必须指定上传的url连接
异步上传的data属性值设置列表
注意:异步上传,必须设置data-name与data-url

参数设置:

参数 类型 默认 必填 描述
data-name String - 对应input的name
data-url String - 文件上传的地址
data-accept String - 对应input的accept,接受的文件类型
data-del Function - 【单文件上传没有该设置】删除某项执行该方法
data-success Function - 上传成功执行该方法
data-error Function - 上传失败执行该方法
data-complete Function - 无论上传成功还是失败,都会执行该方法
图片或文件上传成功后的返回值