项目正在快速迭代中,API 与视觉细节可能随版本调整,请勿用于生产环境。
仅桌面端保证样式

ImportExportPanel 导入导出面板 ​

批量导入与数据导出的双分区面板。组件本身不执行网络 IO:选择文件后 emit import-file、点击格式按钮 emit export,由消费方完成上传/导出后调用 done(kind) 收尾。

状态流转:

  • 选择文件后面板进入导入中(按钮显示导入中并禁用重复选择),移除文件会自动复位;
  • 点击任一导出按钮后导出按钮组整体禁用;
  • 两种状态都只能由消费方调用 done('import' | 'export') 结束——校验失败要立即 done('import'),否则按钮一直转圈。

基础用法 ​

批量导入

仅支持 .xlsx / .csv,单次 5000 行以内

选择文件
数据导出

导出内容为当前筛选结果

导入回调与错误处理 ​

完整闭环示例:import-file 的参数是文件描述对象 { name, size, raw };先做类型/大小校验,失败立即 done('import') 复位,成功则模拟上传后再收尾。

批量导入

仅支持 .xlsx / .csv,单次 5000 行以内

选择文件
数据导出

等待选择文件…

自定义文案与格式按钮 ​

formats 声明导出格式按钮组(默认 [xlsx, csv]),default-format 高亮默认项;accept、import-button-text、分区标题都可定制,例如改成压缩包素材导入。

素材导入

支持 .zip 压缩包,单个 100MB 以内

选择文件
素材导出

导出区扩展内容 ​

export-extra 插槽渲染在导出按钮组下方,适合补充导出范围说明或后台任务提示。

批量导入
选择文件
数据导出

导出内容为当前筛选结果

超过 10 万行将自动转为后台任务,完成后站内通知。

API ​

ImportExportPanel Props

参数说明类型默认值
importTitle / exportTitle分区标题string批量导入 / 数据导出
importTip / exportTip分区说明文案string
importButtonText选择文件按钮文案string选择文件
action上传地址(空则由 import-file 事件处理)string
accept文件类型限制string.xlsx,.xls,.csv
autoUpload选择后立即上传booleanfalse
templateName模板名(非空显示下载模板按钮)string
formats导出格式按钮string[][xlsx, csv]
defaultFormat默认高亮格式stringxlsx

Slots

参数说明类型默认值
export-extra导出按钮组下方的扩展内容——

Events

参数说明类型默认值
import-file选择文件后触发,参数为 { name, size, raw } 等文件描述对象(file) => void—
export点击导出格式按钮(format: string) => void—
download-template点击下载模板() => void—

Methods

参数说明类型默认值
doneIO 完成收尾;done(import) 复位导入按钮,done(export) 恢复导出按钮组(kind?: import | export) => voidimport