Gå til hovedinnhold
KOMPONENTER

Filopplasting

FileUpload en komponent for å ta imot filer fra brukeren.

Dra fil eller klikk for å laste opp

Komponenter

FileUpload

NavnTypePåkrevd?Default-verdiBeskrivelse
multipleboolean
onDragEnter((event: DragEvent<HTMLElement>) => void)
onDragOver((event: DragEvent<HTMLElement>) => void)
onDragLeave((event: DragEvent<HTMLElement>) => void)
acceptstring | string[]

Hvilken filtyper som skal aksepteres

minSizenumber
maxSizenumber
preventDropOnDocumentboolean
noClickboolean
noKeyboardboolean
noDragboolean
noDragEventsBubblingboolean
disabledboolean
onDrop(<T extends File>(acceptedFiles: T[], fileRejections: FileRejection[], event: DropEvent) => void) & EffectCallback

Callback for når en fil legges til

onDropAccepted(<T extends File>(files: T[], event: DropEvent) => void)
onDropRejected((fileRejections: FileRejection[], event: DropEvent) => void)
getFilesFromEvent((event: DropEvent) => Promise<(File | DataTransferItem)[]>)
onFileDialogCancel(() => void)
successTextstring "Opplasting fullført"

Tekst som vises ved fullført opplasting

errorTextstring "Feil ved opplasting av fil"

Tekst som vises om opplasting feilet

standbyTextstring "Dra fil eller klikk for å laste opp"

Tekst som vises før man laster opp noe

errorUploadboolean false

Boolean for hvis opplastingen feiler.

onDelete(file: File) => void

Callback for når en fil slettes fra lista

filesFile[]

Filene som er aktive i komponenten

Bygger på react-dropzone, og vil spre props for den. Les mer om disse her: https://react-dropzone.js.org/#src

Komponenten har ingen validering eller forkasting av potensielt skadelige filer. Dette er noe brukeren selv må stå for. Dette kan forenkles litt ved å bruke accept propen, som begrenser hvilke filtyper som vil aksepteres.

Les mer på OWASP-artikkelen om filopplasting.