Datové vazby a události v hybridním prostředí Blazor
Definovali jste uživatelské rozhraní webové aplikace. Teď se podíváme, jak do aplikace přidat logiku. V aplikaci Blazor můžete přidat kód jazyka C# do samostatných souborů .cs nebo vložených do komponent Razor.
Kód C# vložený v komponentách
Běžným postupem je zkombinovat HTML a C# do jednoho souboru komponenty v syntaxi Razor. U jednoduchých komponent, které nejsou náročné na kód, funguje tento přístup dobře. Pokud chcete do souboru Razor přidat kód, použijete syntaxi Razor.
Co jsou direktivy syntaxe Razor?
Direktivy syntaxe Razor jsou kódem komponent používaným k přidání kódu HTML s vloženým kódem v jazyce C#. Direktivami můžou vývojáři definovat jednotlivé příkazy, metody nebo větší bloky kódu.
Direktivy pro kód
Pro vývojáře, kteří používali Razor v MVC nebo na stránkách, by měly být direktivy pro kód dobře známé.
Můžete použít @expression() k přidání příkazu jazyka C# vloženého do html. Pokud potřebujete více kódu, použijte direktivu @code k přidání více příkazů uzavřených závorky.
Do šablony můžete také přidat @functions oddíl pro metody a vlastnosti. Přidají se na začátek generované třídy, kde na ně dokument může odkazovat.
Vytváření datových vazeb syntaxe Razor
V rámci komponent Razor můžete svázat elementy HTML s daty v polích, vlastnostech a hodnotách výrazů Razor. Datová vazba umožňuje obousměrnou synchronizaci mezi HTML a kódem.
Při vykreslování komponenty se data odešlou z HTML do .NET. Komponenty se vykreslují po spuštění kódu obslužné rutiny události, což je důvod, proč se aktualizace vlastností projeví v uživatelském rozhraní ihned po aktivaci obslužné rutiny události.
Pomocí @bind značek vytvořte vazbu proměnné jazyka C# na vstup HTML. V dalším cvičení se zobrazí příklad datové vazby.