{ "slug": "dragupload", "mode": "single", "curated": true, "examples": [ { "id": "dragupload-ex-1", "title": "基础用法", "titleSrc": "", "desc": "", "html": "
\n

DragUpload 拖拽上传

\n

支持点击或拖拽文件上传,显示进度与缩略图,可删除。

\n
\n
\n
\n ⬆️\n
\n 将文件拖到此处,或\n 点击选择\n
\n
\n \n
\n
\n
\n
", "preview": { "show": [ [ 0 ] ], "hide": [], "mode": "single" }, "previewSafe": true, "previewUnsafeReasons": [], "source": "curated", "code": { "html": "

DragUpload 拖拽上传

\n

支持点击或拖拽文件上传,显示进度与缩略图,可删除。

\n
\n
\n ⬆️\n
\n 将文件拖到此处,或\n 点击选择\n
\n
\n \n
\n
", "jsx": "import { KoleDragUpload } from 'kole-ui/react';\n\n\n
\n ⬆️\n
将文件拖到此处,或 点击选择
\n
\n
\n
\n
文件
\n
\n
合同扫描件.pdf
\n
\n
\n
已完成
\n \n
\n
\n
", "vue3": "\n\n", "vue2": "\n\n", "tsx": "import { KoleDragUpload } from 'kole-ui/react';\n\nexport default function KoleDragUploadDemo(): JSX.Element {\n return (\n \n
\n ⬆️\n
将文件拖到此处,或 点击选择
\n
\n
\n
\n
文件
\n
\n
合同扫描件.pdf
\n
\n
\n
已完成
\n \n
\n
\n
\n );\n}", "vue3ts": "\n\n", "vue2ts": "\n\n" }, "notes": [ "依据 frameworks/DragUpload.html:17-22 的拖拽区(.kole-upload-drop / .kole-upload-icon / .kole-upload-hint)与 :64-77 render() 生成的文件项(thumb/meta/bar/status/del 及「已完成」状态文案);组件无 props(DragUpload.jsx:4 无参数表),按插槽组合承载同一结构" ] } ] }