-
组件布局 Layout视图 View导航 Navigation反馈 Feedback
上传 Uploadissue v2.1.3- v2.1.3
- v2.1.2
- v2.1.1
- v2.1.0
- v2.0.8
- v2.0.7
- v2.0.6
- v2.0.5
- v2.0.4
- v2.0.3
- v2.0.2
- v2.0.1
- v2.0.0
- v1.1.0
- v2.1.3
- v2.1.2
- v2.1.1
- v2.1.0
- v2.0.8
- v2.0.7
- v2.0.6
- v2.0.5
- v2.0.4
- v2.0.3
- v2.0.2
- v2.0.1
- v2.0.0
- v1.1.0
过Upload可以将资源(web page,text,picture,video...)传到远程服务器
何时使用
代替原生 input type='file'
如何使用
import { Upload } from 'tinper-bee';
or
import Upload from 'bee-upload';
import 'bee-upload/build/Upload.css';
能力特性
API
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
accept | 接受上传的文件类型, 详见 input accept Attribute | string | 无 |
name | 发到后台的文件参数名 | string | 'file' |
defaultFileList | 默认已上传的文件列表 | object[] | - |
fileList | 已上传的文件列表,多用于onChange事件里 | array | - |
action | 上传的服务器地址 | string | (file) => Promise |
data | 上传所需参数或返回上传参数的方法 | object | (file) => object |
size | 上传文件的大小限制单位是byte | number | 1024000 |
headers | 设置请求的头部信息 兼容ie10以上 | object | - |
showUploadList | 是否展示文件列表, 可设为一个对象,用于单独设定 showPreviewIcon 和 showRemoveIcon |
Boolean or { showPreviewIcon?: boolean, showRemoveIcon?: boolean } | true |
multiple | 是否支持多文件上传 兼容ie10以上 | bool | false |
accept | 设置文件接收类型 | string | - |
beforeUpload | 上传文件之前的钩子,参数为上传的文件,若返回 false 则停止上传。支持返回一个 Promise 对象,Promise 对象 reject 时则停止上传,resolve 时开始上传( resolve 传入 File 或 Blob 对象则上传 resolve 传入对象)。注意:IE9 不支持该方法。 |
(file, fileList) => `boolean | Promise` |
customRequest | 通过覆盖默认的上传行为,可以自定义自己的上传实现 | Function | - |
onChange | 当上传状态改变之后执行的回调函数 | Function | - |
listType | 内置的样式,支持text和picture | string | 'text' |
onRemove | 点击移除文件时的回调,返回值为 false 时不移除。支持返回一个 Promise 对象,Promise 对象 resolve(false) 或 reject 时不移除。 | Function(file): boolean | Promise |
supportServerRender | 服务端渲染时需要打开这个 | boolean | false |
disabled | 是否禁用,设置为 true 后前端禁止删除已上传文件 | boolean | false |
withCredentials | 上传请求时是否携带 cookie | boolean | false |
enterDragger | 拖拽上传,当鼠标拖拽文件进入 Dragger 区域时触发 | Function | - |
leaveDragger | 拖拽上传,当鼠标拖拽文件离开 Dragger 区域时触发 | Function | - |
onChange
当文件正在上传,上传成功和上传失败触发的回调函数。 当上传状态发生变化,返回下列参数。
{
file: {
uid: 'uid', // 唯一性id
name: 'xx.png' // 文件名
status: 'done', // 参数:uploading, done, error, removed
response: '{"status": "success"}', // 服务器返回的参数
},
fileList: [ /* ... */ ], //当前文件列表
event: { /* ... */ }, //服务器响应:包括上传进度 不兼容老的浏览器
}
注意事项
暂无
更新日志
-
v2.1.1 2020-01-17 ( release地址 )
- bee-upload @2.1.1
- [ Feature ] 增加enterDragger、leaveDragger钩子函数。
- bee-upload @2.1.1
-
v2.0.4 2019-10-11 ( release地址 )
- bee-upload @2.0.4
- [Fixbug]删除按钮样式不对。
- [Fixbug]onRemove 返回值为 false 时,依然可以删除。
- bee-upload @2.0.4
-
v2.0.2 2019-09-21 ( release地址 )
- bee-upload @2.0.2
- [Feature]支持自定义属性。
- bee-upload @2.0.2
-
v2.0.1 2019-09-09 ( release地址 )
- bee-upload @2.0.1
- [Feature]新增 disabled API,用于禁止上传、删除已上传列表行为。
- [Feature]listType API 新增 picture-card 类型,支持图片预览及删除功能。
- bee-upload @2.0.1