uxcore-uploader v3.7.4

Uxcore Uploader

uxcore-uploader component for react

$ git clone https://github.com/uxcore/uxcore-uploader
$ cd uxcore-uploader
$ npm start

see https://uxco.re/components/uploader/ for details.

上传组件, 封装UploadCore核心组件, 作为UI层.

API

reset()

重置文件队列

Props

fileList 的最小格式 (格式稍显麻烦，是为了 onChange 的返回值可以传回给 fileList)

[
    {
        name: '', // 文件名称，列表形式必填
        ext: '', // 文件扩展名。例如 jpg。可选，不填时无法根据类型展示对应图标
        fileType: '', // 文件 mimetypes 类型。 例如 image/jpg。 可选，不填时无法根据类型展示对应图标
        response: {
            url: xxx,  // 文件链接，必填
            canRemove: true, // 是否可以删除，可选
            downloadUrl: 'xxxx', // 下载 URL，可选
        }
    }
]

fileList 更新说明

Since 3.3.10 版本，当前已存在的文件列表数据不需要自己再组装一个 response 结构，组件内部会根据顶层数据来组装：

[
  {
    name: 'My File',
    ext: '.jpg',
    fileType: 'image/jpg',
    url: 'https://www.foo.bar/aaa.jpg',
    previewUrl: '', // 可选
    canRemove: true // 可选
  }
]

Events

onChange 的 fileList 的枚举格式有如下几种

[
    // 上传后的文件的格式， response 即服务器返回的值
    {
        id: 'xxxx', // 如果 response.content 中有提供
        url: 'xxx', // 如果 response.content 中有提供
        previewUrl: 'xxx', // 如果 response.content 中有提供
        type: 'upload',
        ext: file.ext,
        name: file.name,
        response: JSON.parse(file.response)
    },
    // 预览用文件的格式， `props.fileList` 相关， responce 即 `props.fileList` 里传入的格式。
    {
        type: 'list',
        response: file
    },
    // 被删除的文件的格式
    {
        type: 'delete',
        subType: 'list/upload', // 与上面两种类型对应，用于解析 response
        response: file // 与上面的 subType 相对应
    }
]

Other Events

具体配置信息见https://github.com/uxcore/uxcore-uploadcore/blob/master/README.md.