开发预览更新于 2026-05-10

FilePicker 文件选择

按钮触发文件选择对话框，自带选中文件列表。区别于 Dropzone（拖拽落区）。

基础用法

multiple 多选，accept MIME / 后缀过滤；选中文件以 chip 形式列在按钮旁，单个删除或一键清空。

未选择文件

<CfFilePicker v-model="files" multiple accept="image/*,application/json" />

<CfFilePicker value={files} onChange={setFiles} multiple accept="image/*" />

variant="plain" 取消按钮边框，作为链接式触发；disabled 全局禁用。

single + outline

未选择文件

multiple + plain + size lg

未选择文件

disabled

未选择文件

<CfFilePicker v-model="files" variant="plain" size="lg" multiple />

<CfFilePicker value={files} onChange={setFiles} variant="plain" size="lg" multiple />