Domača » Toolkit » Free ES5 / ES6 JavaScript File Upload Plugin - Uppy

    Free ES5 / ES6 JavaScript File Upload Plugin - Uppy

    Eden od najtežjih oblik vložkov za oblikovanje je nalaganje datoteke. Ima privzeti slog HTML, vendar ni najlepša stvar na svetu.

    Uppy prenese prenos datotek na povsem novo raven z a vmesnik po meri in a dinamičen proces nalaganja v slogu Ajaxa.

    To deluje na kodo ES5 / ES6, tako lahko izdelate svoje spletne aplikacije z najnovejšimi standardi JavaScript. In celo podpira nalaganje datotek iz oblakov kot so Dropbox ali Google Drive, zato je večplastni skript za nalaganje datotek za splet.

    Uppy je popolnoma prost in odprtokoden, z repo na GitHubu. Najlažji način namestitve tega vtičnika je z npm ali Preja, tako da lahko zaženite ga kot pravi paket.

    Ko dobite datoteke, dodane na vašo spletno stran, ste pravkar vključujejo datoteko Uppy.js in kodo CSS. Nato ciljate katerokoli vhodno polje, ki ga želite, in Uppy poskrbi za ostalo.

    Ima edinstven vmesnik, ki izgleda kot velik kvadratni položaj povleci in spusti datoteke. Lahko tudi izberite elemente s trdega diska ali celo nalaganje datotek na daljavo iz zunanjih naslovov URL. Precej noro!

    Celoten postopek namestitve najdete na strani z dokumentacijo, vendar je ta zahteva vsaj nekaj razumevanja ECMAScripta 6. Ta knjižnica je usmerjena v prihodnost skriptiranja in ni najlažja za uporabo s čistim JavaScriptom iz vanilije.

    Toda, če ste resni glede spletnega razvoja, je vredno vseeno naučiti ES6. Lahko najdeš ton virov na spletu za samostojno poučevanje in lahko uporabite Uppy kot svoj prvi “resnično” projekt za potop in začetek učenja.

    Oglejte si primer nadzorne plošče za glej Uppy v akciji. Za to stran, Nalaganje je skrito za sprožilcu, kjer kliknete gumb, da prikažete polje modalnega prenosa.

    Od tam lahko izberete, ali želite naložiti sliko iz računalnika, spleta ali spletne kamere!

    Na strani Primeri je na voljo skupina za pregledovanje, vključno z a primer povleci in spusti, skupaj z internacionalizirana predstavitvena stran.

    Ampak, da bi resnično izvedeli, kako to deluje, vam priporočam, da pospremite dokumente in brskate po glavnem GitHub repu. Lahko tudi delite svoje misli z ustvarjalci na Twitter @transloadit.