文件选择器组件
文件选择器API
注:类型中加粗项为特殊类型定义或枚举类型定义,可在下方查看具体定义
| API | 说明 | 类型 | 是否为必传参数 | 默认值 |
|---|---|---|---|---|
| title | 文件选择器标题 | string | ReactNode | 是 | - |
| selectMode | 文件选择器选择模式 | SELECT_MODE_TYPE | 否 | 'file' |
| menu | 文件选择器左侧展示菜单项 | array<MENU_TYPE> | array<IMenu> | array<IDivider> | 否 | [ 'latest', 'tags', 'sharing',{'divider':true},'space', 'group', 'devices','favorite' ] |
| path | 文件选择器初始目录路径 | IPath | 否 | |
| files | 文件信息(文件重命名输入框通过此参数传入原始name) | array<IFile> | 否 | [] |
| fileTypeFilter | 文件类型筛选,优先级第三 | IFileTypeFilter | 否 | - |
| driveIdFilter | driveId筛选,优先级第二 | IIdFilter | 否 | - |
| fileIdFilter | 文件Id筛选,优先级第一 | IIdFilter | 否 | - |
| multiSelect | 是否开启多选(目前仅选择文件模式支持多选) | boolean | IMultiSelect | 否 | false |
| showCreateFolder | 是否显示创建文件夹 | boolean | 否 | false |
| showRenameFile | 是否显示文件重命名 | boolean | 否 | false |
| showNavBar | 是否显示导航栏 | boolean | 否 | true |
| showSearch | 是否显示搜索栏 | boolean | 否 | true |
| showRecently | 是否显示最近使用 | boolean | 否 | true(暂不支持此功能) |
| extra | 文件选择器弹窗扩展属性 | IExtra | 否 | - |
| className | 文件选择器内容类名 | string | 否 | - |
| okText | 确定按钮文案 | string | ReactNode | 否 | 确定 |
| cancelText | 取消按钮文案 | string | ReactNode | 否 | 取消 |
| onOK | 确定按钮回调 | function(target: files | folder, fileName?: string) | 是 | - |
| onCancel | 取消按钮回调 | function() | 是 | - |
文件选择器API中特殊类型定义
IMenu
| API | 说明 | 类型 | 是否为必传参数 | 默认值 |
|---|---|---|---|---|
| key | 自定义菜单项key值 | MENU_TYPE | string | 是 | - |
| name | 自定义菜单名 | string | 否 | 若通过key可以找到默认菜单项,则为对应菜单项name,若找不到则为空 |
| icon | 自定义菜单图标 | ReactNode | 否 | 若通过key可以找到默认菜单项,则为对应菜单项icon,若找不到则为空 |
| disabled | 自定义菜单项是否禁用 | boolean | 否 | false |
| isRename | 是否重命名默认菜单(配合name字段使用) | boolean | 否 | false |
IDivider
| API | 说明 | 类型 | 是否为必传参数 | 默认值 | 备注 |
|---|---|---|---|---|---|
| divider | 菜单分隔线 | boolean | 是 | - | 自定义左侧菜单项时使用 |
IPath
| API | 说明 | 类型 | 是否为必传参数 | 默认值 | 备注 |
|---|---|---|---|---|---|
| menu | 文件选择器左侧菜单初始选中项 | MENU_TYPE | 是 | - | - |
| parentId | 当前目录id | string | 否 | - | 若右侧初始想在某一目录下,该参数必传;若在根目录则传‘0’ |
| driveId | driveId | string | 否 | - | 若右侧初始想在某一目录下,该参数必传 |
| groupId | 当前路径团队id | string | 否 | - | 若右侧初始想在某一目录下,该参数必传;若在我的云文档目录下则传"private";若在我的设备目录下则传"roaming" |
| type | 当前路径类型 | PATH_TYPE | 否 | - | 若右侧初始想在某一目录下,该参数必传 |
| name | 当前路径名 | string | 否 | - | 若右侧初始想在某一目录下,该参数必传 |
IFileTypeFilter
| API | 说明 | 类型 | 是否为必传参数 | 默认值 | 备注 |
|---|---|---|---|---|---|
| disabled | 文件类型黑名单(优先级高) | array<FILE_FILTER_TYPE> | array<string> | 否 | [] | 由文件后缀名或由文件选择器组件提供的常见组件类型后缀枚举组成的数组 |
| enabled | 文件类型白名单 | array<FILE_FILTER_TYPE> | array<string> | 否 | [] | 由文件后缀名或由文件选择器组件提供的常见组件类型后缀枚举组成的数组 |
IIdFilter
| API | 说明 | 类型 | 是否为必传参数 | 默认值 |
|---|---|---|---|---|
| disabled | id黑名单(优先级高) | array<string> | 否 | [] |
| enabled | id白名单 | array<string> | 否 | [] |
IFile
| API | 说明 | 类型 | 是否为必传参数 | 默认值 | 备注 |
|---|---|---|---|---|---|
| id | 文件id | string | 是 | - | |
| name | 文件名 | string | 是 | - | |
| driveId | driveId | string | 是 | - | |
| groupId | 文件所属团队id | string | 是 | - | 若在我的云文档目录下则传"private";若在我的设备目录下则传"roaming" |
| type | 文件类型 | FILE_TYPE | 是 | - |
IMultiSelect
| API | 说明 | 类型 | 是否为必传参数 | 默认值 |
|---|---|---|---|---|
| isEnable | 是否开启多选 | boolean | 是 | - |
| isCrossDir | 是否支持跨目录多选 | boolean | 否 | false |
| maxSelectNum | 最大选中数量 | number | 否 | - |
IExtra
| API | 说明 | 类型 | 是否为必传参数 | 默认值 |
|---|---|---|---|---|
| width | 文件选择器弹窗宽度 | number | string | 否 | 802 |
| wrapClassName | 对话框外层容器的类名 | string | 否 | - |
| zIndex | 设置弹窗的显示层级 | number | 否 | 1000 |
| style | 可用于设置浮层的样式,调整浮层位置等 | CSSProperties | 否 | - |
| bodyStyle | 弹窗body 样式 | CSSProperties | 否 | - |
| centered | 垂直居中展示弹窗 | boolean | 否 | true |
| closable | 是否显示右上角的关闭按钮 | boolean | 否 | true |
| closeIcon | 自定义关闭图标 | ReactNode | 否 | - |
| mask | 是否展示遮罩 | boolean | 否 | true |
| maskClosable | 点击蒙层是否允许关闭 | boolean | 否 | false |
| maskStyle | 遮罩样式 | CSSProperties | 否 | - |
| getContainer | 文件选择器弹窗挂载的节点 | HTMLElement | 否 | - |
文件选择器API中枚举类型定义
SELECT_MODE_TYPE
| 枚举值 | 枚举值类型 | 说明 | 备注 |
|---|---|---|---|
| file | string | 选择文件模式 | - |
| folder | string | 选择文件目录模式 | 该模式目前仅支持单选 |
| all | string | 选择文件和文件目录模式 | 该模式目前仅支持多选且不支持跨目录选中(2025.02a版本支持) |
MENU_TYPE
| 枚举值 | 枚举值类型 | 说明 |
|---|---|---|
| latest | string | 最近列表 |
| tags | string | 星标列表 |
| sharing | string | 共享列表 |
| space | string | 我的云文档列表 |
| group | string | 团队列表 |
| favorite | string | 常用列表 |
| devices | string | 我的设备列表 |
FILE_FILTER_TYPE
| 枚举值 | 枚举值类型 | 说明 | 备注 |
|---|---|---|---|
| IMG_ARRAY | string | 图片类型 | ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'svg'] |
| ZIP_ARRAY | string | 压缩包类型 | ['zip', '7z', 'rar', 'iso', 'gz', 'tar'] |
| DOC_ARRAY | string | 文字类型 | ['wps','wpt','doc','docx','dot','rtf','xml','docm','dotm','wdoc','uof', 'uot3','uott3'] |
| XLS_ARRAY | string | 表格类型 | ['et','ett','xls','xlsx','xlsm','xlsb','xlam','xltx','xltm','xlt','xla', 'xlw','odc','uxdc','dbf','prn','wxls','csv'] |
| PPT_ARRAY | string | 演示类型 | ['dps','dpt','pptx','ppt','pptm','ppsx','pps','ppsm','potx','pot','potm','wpd','wppt'] |
| TXT_ARRAY | string | 文本类型 | ['txt', 'text'] |
| VIDEO_ARRAY | string | 视频类型 | ['asf','avi','wm','wmp','wmv','ram','rm','rmvb','rp','rpm','rt','smi','smil','dat','m1v','m2p','m2t','m2ts','m2v','mp2v','mpe','mpeg','mpg','mpv2','pss','pva','tp','tpr','ts','m4b','m4p','m4v','mp4','mpeg4','3g2','3gp','3gp2','3gpp','mov','qt','f4v','flv','hlv','swf','ifo','vob','amv','bik','csf','divx','evo','ivm','mkv','mod','mts','ogm','pmp','scm','tod','vp6','webm','xlmv'] |
| AUDIO_ARRAY | string | 音频类型 | ['aac','ac3','amr','ape','cda','dts','flac','m1a','m2a','m4a','mid','midi','mka','mp2','mp3','mpa','ogg','ra','tak','tta','wav','wma','wv'] |
PATH_TYPE
| 枚举值 | 枚举值类型 | 对应文件后缀 |
|---|---|---|
| folder | string | 文件夹 |
| whole | string | 全员团队 |
| dept | string | 部门团队 |
| normal | string | 普通团队 |
FILE_TYPE
| 枚举值 | 枚举值类型 | 说明 |
|---|---|---|
| file | string | 文件类型 |
| folder | string | 文件夹类型 |
| shortcut | string | 快捷方式类型 |