FileUpload

Install and import #

FileUpload uses render props so you can pass a button through. You have access to openFile to open the native file chooser dialog box.

See your browser console for the real File object ready to upload.

Default #

See more about media type.


Files must be <200MB

Show preview if value exists #


example.docx
Files must be <200MB

Multiple #

Add multiple property.


Files must be <200MB

Disabled #


Customize #

Change Button #

You can change the upload button component.


Change Preview #

You can change the preview component.


example.docx

You can also set the preview prop to null and handle your own preview in place of the upload button with files & onRemoveFile render props:


Properties #

FileUpload #

NameType(s)DefaultRequired
accept
string

Pass a comma-separated string of file types e.g. "image/png" or "image/png,image/jpeg"

*/*
children
func
disabled
bool
draggable
bool
handleAddFile
func
handleRemoveFile
func
maxSize
number
2000000
multiple
bool
name
string
onBlur
func
onChange
func
onError
func
preview
node
DefaultPreview
title
string | node
value
string | object
[]

Dependencies #

Peer dependencies #