Nové výhodné předplatné namísto kreditů je tu! Více informací. Upravili jsme také naše provozní podmínky.
NOVINKA: Staň se datovým analytikem a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:

Lekce 12 - Databázový klient v React - Formulářová komponenta filmů

V minulé lekci, Databázový klient v React - InputCheck a InputSelect, jsme pokračovali s tvorbou univerzálních formulářových vstupů. Vytvořili jsme si komponenty InputCheck a InputSelect.

V dnešním React tutoriálu začneme s tvorbou samotných komponent formulářů. Budeme přitom využívat připravené komponenty formulářových vstupů, což nám tuto práci výrazně usnadní.

Komponenty s formulářem si opět vytvoříme ve dvojici, tj. zvlášť pro filmy a zvlášť pro osoby. Jejich funkcionalita bude zahrnovat vytváření nových i úpravu existujících záznamů. Podle aktuální potřeby bude komponenta v režimu vkládání (výchozí) nebo editace. Pokud bude předáno ID záznamu k editaci, načte se daný záznam z databáze a jeho hodnoty se předvyplní do formuláře.

Obsah elementu <form> složíme z připravených komponent, které vybereme podle typu příslušné hodnoty. Pro obsluhu zadání hodnoty do formulářových vstupů napíšeme obslužnou funkci, která bude předána v atributu jednotlivým vstupům.

Vytvoření komponenty MovieForm

Jako první si tedy napíšeme opět komponentu pro filmy. Budeme postupovat od inicializace hodnot a přípravy obslužných funkcí, přes načtení záznamů z databáze, po vykreslení formuláře a obsluhu jeho vstupů. Výsledek bude vypadat nějak takto:

Formulář filmů - REST API klient v React - Filmová databáze

Ve složce src/movies/ vytvoříme


 

...konec náhledu článku...
Pokračuj dál

Znalosti v hodnotě stovek tisíc získáš za pár korun

Došel jsi až sem a to je super! Věříme, že ti první lekce ukázaly něco nového a užitečného.
Chceš v kurzu pokračovat? Přejdi do prémiové sekce.

Před koupí tohoto článku je třeba koupit předchozí díl

Obsah článku spadá pod licenci Premium, koupí článku souhlasíš s Provozními podmínkami.

Co od nás v dalších lekcích dostaneš?
  • Přístup k jednotlivým lekcím dle způsobu pořízení.
  • Kvalitní znalosti v oblasti IT.
  • Dovednosti, které ti pomohou získat vysněnou a dobře placenou práci.

Popis článku

Požadovaný článek má následující obsah:

V JavaScript tutoriálu začneme s vytvářením komponent formulářů s použitím připravených formulářových vstupů v React. První bude k vložení nového filmu.
Článek pro vás napsal Petr Kozler
Avatar
Autor se věnuje vývoji převážně webových aplikací v PHP nebo Pythonu.
Aktivity