shadow
Komponent FileUpload poskytuje univerzálnu funkciu nahrávania súborov pre webové aplikácie. Podporuje prispôsobiteľné atribúty, ako sú povolené typy súborov, veľkosť častí alebo tiež maximálnu veľkosť súboru, spolu s metódami drag-and-drop a tradičným výberom súborov.
Použite wje-file-upload, keď používateľ zadáva hodnotu, vyberá možnosti alebo vykonáva akciu vo formulári.
Nepoužívajte ho len ako vizuálny dekoratívny prvok bez interakcie. V takom prípade uprednostnite prezentačné komponenty.
Vždy prepojte komponent s popisom (label/aria-label), zachovajte ovládanie klávesnicou a pri validačných chybách zobrazte zrozumiteľnú správu.
Odporúčané postupy
- Majte jednotné validačné pravidlá a error stavy naprieč celým formulárom.
- Pri asynchrónnych operáciách zobrazte stav načítania alebo disabled stav.
- Pri zložitých formulároch preferujte menšie sekcie a okamžitú spätnú väzbu.
| Popis | Nastavuje zobrazený alebo prístupný textový štítok. |
| Atribút | label |
| Typ | string |
| Predvolené | - |
| Popis | Nastavuje textovú hodnotu uloženú vo voľbe accepted-types. |
| Atribút | accepted-types |
| Typ | string |
| Predvolené | - |
| Popis | Nastavuje rozmery alebo veľkosť pre voľbu chunk-size. |
| Atribút | chunk-size |
| Typ | number |
| Predvolené | - |
| Popis | Nastavuje rozmery alebo veľkosť pre voľbu max-file-size. |
| Atribút | max-file-size |
| Typ | number |
| Predvolené | - |
| Popis | Nastavuje odkaz na zdroj pre voľbu upload-url. |
| Atribút | upload-url |
| Typ | string |
| Predvolené | - |
| Popis | Určuje, či je voľba auto-process-files zapnutá a ovplyvňuje správanie komponentu. |
| Atribút | auto-process-files |
| Typ | boolean |
| Predvolené | - |
| Popis | Určuje, či je voľba no-upload-button zapnutá a ovplyvňuje správanie komponentu. |
| Atribút | no-upload-button |
| Typ | boolean |
| Predvolené | - |
| Názov | Popis |
|---|
wje-file-upload:file-removed | Vyvolá sa pri odoslaní udalosti wje-file-upload:file-removed. |
wje-file-upload:files-selected | Vyvolá sa pri zmene výberu. |
wje-file-upload:error | Vyvolá sa pri chybovom stave komponentu. |
wje-file-upload:files-added | Vyvolá sa pri odoslaní udalosti wje-file-upload:files-added. |
wje-file-upload:files-uploaded | Vyvolá sa pri odoslaní udalosti wje-file-upload:files-uploaded. |
wje-file-upload:started | Vyvolá sa pri odoslaní udalosti wje-file-upload:started. |
wje-file-upload:file-uploaded | Vyvolá sa pri odoslaní udalosti wje-file-upload:file-uploaded. |
| Popis | Pridá files to queue do spravovanej kolekcie komponentu. |
| Signatúra | (files: any) => void |
| Popis | Spustí metódu uploadFiles na vykonanie logiky komponentu a aktualizáciu jeho stavu. |
| Signatúra | () => void |
| Popis | Vytvorí preview a pripojí ho do štruktúry komponentu. |
| Signatúra | (file: File, reader: FileReader) => HTMLElement |
| Popis | Vytvorí thumbnail a pripojí ho do štruktúry komponentu. |
| Signatúra | (file: File, reader: FileReader) => HTMLElement |
| Popis | Spustí metódu assertFilesValid na vykonanie logiky komponentu a aktualizáciu jeho stavu. |
| Signatúra | (file: File) => void |
| Popis | Obnoví form state na počiatočné hodnoty. |
| Signatúra | () => void |
| Názov | Popis |
|---|
native | Štýluje koreňovú shadow časť komponentu. |
file-list | Štýluje shadow časť file-list. |
upload-button | Štýluje shadow časť upload-button. |
Pre tento komponent nie sú dostupné žiadne vlastné CSS vlastnosti.
| Názov | Popis |
|---|
default | Predvolený slot pre hlavný obsah komponentu. |