en-US

This example shows multiple selection, restricting file types, and selecting folders (non-standard).

zh-CN

该示例展示了多选、限制文件类型以及选择文件夹（非标准）。

import { UploadOutlined } from '@react-devui/icons';
import { DUpload, DButton } from '@react-devui/ui';

export default function Demo() {
  return (
    <>
      <DUpload
        accept="image/*"
        multiple
        dTrigger={
          <DButton className="mb-2" dIcon={<UploadOutlined />}>
            Multiple And Accept Image
          </DButton>
        }
        dList={<DUpload.List />}
        dXHRRequest={{ url: 'https://rd-upload.free.beeceptor.com' }}
      >
        {({ trigger, list }) => (
          <>
            {trigger}
            {list}
          </>
        )}
      </DUpload>
      <br />
      <DUpload
        webkitdirectory=""
        dTrigger={
          <DButton className="mb-2" dIcon={<UploadOutlined />}>
            Directory
          </DButton>
        }
        dList={<DUpload.List />}
        dXHRRequest={{ url: 'https://rd-upload.free.beeceptor.com' }}
      >
        {({ trigger, list }) => (
          <>
            {trigger}
            {list}
          </>
        )}
      </DUpload>
    </>
  );
}