ASP.NET Core Blazor elrendezései
Jegyzet
Ez nem a cikk legújabb verziója. A jelenlegi kiadást lásd ennek a cikknek a .NET 9-es verziójában.
Figyelmeztetés
A ASP.NET Core ezen verziója már nem támogatott. További információ: .NET és .NET Core támogatási szabályzat. Az aktuális kiadást az ennek a cikknek a .NET 9-es verziójában láthatja.
Fontos
Ezek az információk egy olyan előzetes termékre vonatkoznak, amelyet a kereskedelmi forgalomba kerülés előtt jelentősen módosíthatnak. A Microsoft nem vállal kifejezett vagy hallgatólagos szavatosságot az itt megadott információkra vonatkozóan.
Az aktuális kiadást lásd a cikk .NET 9-es verziójában.
Ez a cikk azt ismerteti, hogyan hozhat létre újrafelhasználható elrendezési összetevőket Blazor alkalmazásokhoz.
Az Blazor elrendezések hasznossága
Egyes alkalmazáselemek, például a menük, a szerzői jogi üzenetek és a vállalati emblémák általában az alkalmazás általános bemutatójának részei. A jelölések másolatának az alkalmazás minden összetevőjébe való elhelyezése nem hatékony. Minden alkalommal, amikor ezen elemek egyikét frissítik, az elemet használó összes összetevőt frissíteni kell. Ez a megközelítés költséges a karbantartáshoz, és a frissítés kihagyása esetén inkonzisztens tartalomhoz vezethet. elrendezések megoldják ezeket a problémákat.
A Blazor elrendezés egy Razor összetevő, amely jelölőjeleket oszt meg az arra hivatkozó összetevőkkel. Az elrendezések használhatják az adatkötést, a függőséginjektálást, valamint az összetevők egyéb funkcióit.
Elrendezési összetevők
Elrendezési összetevő létrehozása
Elrendezési összetevő létrehozása:
- Hozzon létre egy Razor összetevőt, amelyet egy Razor sablon vagy C# kód határoz meg. A Razor sablonon alapuló elrendezési összetevők ugyanúgy használják a
.razor
fájlkiterjesztést, mint a szokásos Razor összetevőket. Mivel az elrendezési összetevők meg vannak osztva az alkalmazás összetevői között, általában az alkalmazásShared
vagyLayout
mappájába kerülnek. Az elrendezések azonban bármely olyan helyre elhelyezhetők, amely elérhető az azt használó összetevők számára. Egy elrendezés például ugyanabban a mappában helyezhető el, mint az azt használó összetevők. - Örökölje az összetevőt a LayoutComponentBase-tól. A LayoutComponentBase definiál egy Body tulajdonságot (RenderFragment típust) a renderelt tartalomhoz az elrendezésen belül.
- A Razor szintaxis
@Body
segítségével adja meg a helyet az elrendezési jelölésben, ahol a tartalom megjelenik.
Jegyzet
További információkért a RenderFragment-ról lásd a ASP.NET Core Razor összetevők.
Az alábbi DoctorWhoLayout
összetevő egy elrendezési összetevő Razor sablonját jeleníti meg. Az elrendezés örökli a LayoutComponentBase-t, és a @Body
-et a navigációs sáv (<nav>...</nav>
) és a lábléc (<footer>...</footer>
) között állítja be.
DoctorWhoLayout.razor
:
@inherits LayoutComponentBase
<PageTitle>Doctor Who® Database</PageTitle>
<header>
<h1>Doctor Who® Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/ https://www.bbc.com";
}
@inherits LayoutComponentBase
<PageTitle>Doctor Who® Database</PageTitle>
<header>
<h1>Doctor Who® Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/ https://www.bbc.com";
}
@inherits LayoutComponentBase
<header>
<h1>Doctor Who™ Episode Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
<header>
<h1>Doctor Who™ Episode Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
<header>
<h1>Doctor Who™ Episode Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
<header>
<h1>Doctor Who™ Episode Database</h1>
</header>
<nav>
<a href="main-list">Main Episode List</a>
<a href="search">Search</a>
<a href="new">Add Episode</a>
</nav>
@Body
<footer>
@TrademarkMessage
</footer>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
MainLayout
összetevő
Egy Blazor projektsablonbóllétrehozott alkalmazásban a MainLayout
összetevő az alkalmazás alapértelmezett elrendezési.
Blazorelrendezése alkalmazza a Flexbox layout model (MDN documentation) (W3C specifikáció).
BlazorCSS elkülönítési funkciójának izolált CSS-stílusokat alkalmaz a MainLayout
összetevőre. Konvenció szerint a stílusokat az azonos nevű kísérő stíluslap biztosítja, MainLayout.razor.css
. A stíluslap ASP.NET Core-keretrendszerének implementálása a ASP.NET Core referenciaforrásban (dotnet/aspnetcore
GitHub-adattárban) érhető el:
Jegyzet
A .NET referenciaforrásra mutató dokumentációs hivatkozások általában betöltik az adattár alapértelmezett ágát, amely a .NET következő kiadásának aktuális fejlesztését jelöli. Egy adott kiadás címkéjének kiválasztásához használja a Ágak vagy címkék legördülő menüt. További információ: A ASP.NET Core-forráskód (dotnet/AspNetCore.Docs #26205) verziócímkéjének kiválasztása.
BlazorCSS elkülönítési funkciójának izolált CSS-stílusokat alkalmaz a MainLayout
összetevőre. Konvenció szerint a stílusokat az azonos nevű kísérő stíluslap biztosítja, MainLayout.razor.css
.
Elrendezés alkalmazása
Az elrendezés névterének elérhetővé tétele
Az elrendezésfájl helyei és névterei idővel megváltoztak a Blazor-keretrendszer esetében. A Blazor verziójától és az éppen létrehozott Blazor alkalmazás típusától függően előfordulhat, hogy a használat során meg kell jelölnie az elrendezés névterét. Ha egy elrendezés implementációjára hivatkozik, és az elrendezés nem található az elrendezés névterének megjelölése nélkül, kövesse az alábbi módszerek egyikét:
Adjon hozzá egy
@using
direktívát a_Imports.razor
fájlhoz az elrendezések helyének meghatározásához. Az alábbi példában az elrendezésekLayout
nevű mappája egyComponents
mappában található, az alkalmazás névtere pedigBlazorSample
:@using BlazorSample.Components.Layout
Adjon hozzá egy
@using
direktívát az összetevődefiníció tetején, ahol az elrendezést használják:@using BlazorSample.Components.Layout @layout DoctorWhoLayout
Teljes mértékben minősítse annak az elrendezésnek a névterét, ahol a rendszer használja:
@layout BlazorSample.Components.Layout.DoctorWhoLayout
Egy elrendezés alkalmazása egy összetevőre
A @layout
Razor direktívával elrendezést alkalmazhat egy útválasztható Razor komponensre, amely rendelkezik egy @page
direktívával. A fordító átalakítja @layout
egy LayoutAttribute, és alkalmazza az attribútumot az összetevőosztályra.
A következő Episodes
összetevő tartalmát a rendszer a @Body
pozíciójánál helyezi be a DoctorWhoLayout
-be.
Episodes.razor
:
@page "/episodes"
@layout DoctorWhoLayout
<h2>Doctor Who® Episodes</h2>
<ul>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfknq">
<em>The Ribos Operation</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfdsb">
<em>The Sunmakers</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vhc26">
<em>Nightmare of Eden</em>
</a>
</li>
</ul>
@page "/episodes"
@layout DoctorWhoLayout
<h2>Doctor Who® Episodes</h2>
<ul>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfknq">
<em>The Ribos Operation</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfdsb">
<em>The Sunmakers</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vhc26">
<em>Nightmare of Eden</em>
</a>
</li>
</ul>
@page "/episodes"
@layout DoctorWhoLayout
<h2>Episodes</h2>
<ul>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfknq">
<em>The Ribos Operation</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfdsb">
<em>The Sun Makers</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vhc26">
<em>Nightmare of Eden</em>
</a>
</li>
</ul>
@page "/episodes"
@layout DoctorWhoLayout
<h2>Episodes</h2>
<ul>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfknq">
<em>The Ribos Operation</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfdsb">
<em>The Sun Makers</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vhc26">
<em>Nightmare of Eden</em>
</a>
</li>
</ul>
@page "/episodes"
@layout DoctorWhoLayout
<h2>Episodes</h2>
<ul>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfknq">
<em>The Ribos Operation</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vfdsb">
<em>The Sun Makers</em>
</a>
</li>
<li>
<a href="https://www.bbc.co.uk/programmes/p00vhc26">
<em>Nightmare of Eden</em>
</a>
</li>
</ul>
Az alábbi renderelt HTML-jelölést az előző DoctorWhoLayout
és Episodes
összetevő állítja elő. A felesleges jelölőelemek nem jelennek meg annak érdekében, hogy a hangsúly a két érintett összetevő által biztosított tartalmon legyen.
- Az élőfej (
<header>...</header>
), a navigációs sáv (<nav>...</nav>
) és az élőlábban (<footer>...</footer>
) található H1 "adatbázis" fejléc (<h1>...</h1>
) aDoctorWhoLayout
összetevőből származik. - A H2 "epizódok" címsora (
<h2>...</h2>
) és az epizódlista (<ul>...</ul>
) aEpisodes
összetevőből származik.
<header>
<h1 ...>...</h1>
</header>
<nav>
...
</nav>
<h2>...</h2>
<ul>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<footer>
...
</footer>
Ha egy összetevőben közvetlenül megadja az elrendezést, az felülír egy alapértelmezett elrendezést.
- Egy
_Imports.razor
fájlból importált@layout
direktíva alapján, az alábbi Elrendezés alkalmazása az összetevők mappájára szakaszban leírtak szerint. - Állítsa be az alkalmazás alapértelmezett elrendezését a jelen cikk későbbi, Alapértelmezett elrendezés alkalmazása alkalmazásra szakaszában leírtak szerint.
Elrendezés alkalmazása egy összetevőket tartalmazó mappára
Egy alkalmazás minden mappája opcionálisan tartalmazhat egy _Imports.razor
nevű sablonfájlt. A fordító tartalmazza az importálási fájlban megadott irányelveket az ugyanabban a mappában lévő Razor-sablonokban, és rekurzívan az összes almappájában. Ezért egy @layout DoctorWhoLayout
tartalmazó _Imports.razor
-fájl biztosítja, hogy a mappa összes összetevője használja a DoctorWhoLayout
összetevőt. Nem szükséges a mappában és az almappákban minden Razor összetevőhöz (.razor
) ismételten hozzáadnia a @layout DoctorWhoLayout
-t.
_Imports.razor
:
@layout DoctorWhoLayout
...
A _Imports.razor
fájl hasonló a _ViewImports.cshtml fájlhoz Razor nézetekhez és lapokhoz, de kifejezetten Razor összetevőfájlokra vonatkozik.
Az _Imports.razor
elrendezésének megadása felülbírálja az útválasztó alapértelmezett alkalmazáselrendezésként megadott elrendezést, amelyet a következő szakaszban ismertetünk.
Figyelmeztetés
Ne adjon hozzá Razor@layout
direktívát a gyökér _Imports.razor
fájlhoz, ami végtelen elrendezési ciklust eredményez. Az alapértelmezett alkalmazáselrendezés szabályozásához adja meg az elrendezést a Router összetevőben. További információ: Alapértelmezett elrendezés alkalmazása alkalmazás szakaszra.
Jegyzet
A @layout
Razor irányelv csak azokra az Razor összetevőkre alkalmaz elrendezést, amelyek rendelkeznek @page
irányelvvel és irányíthatók.
Alapértelmezett elrendezés alkalmazása alkalmazásra
Adja meg az alapértelmezett alkalmazáselrendezést a Router összetevő RouteView összetevőjében. Az elrendezés típusának beállításához használja a DefaultLayout paramétert:
<RouteView RouteData="routeData" DefaultLayout="typeof({LAYOUT})" />
Az előző példában a {LAYOUT}
helyőrző az elrendezés (például DoctorWhoLayout
, ha az elrendezés fájl neve DoctorWhoLayout.razor
). Előfordulhat, hogy az elrendezés névterét a .NET-verziótól és a Blazor alkalmazás típusától függően kell megadnia. További információ: lásd a Az elrendezés névterének elérhetővé tétele szakaszt.
Az elrendezés alapértelmezettként való megadása az Router-összetevő RouteView-ben hasznos gyakorlat, mivel a jelen cikk előző szakaszaiban leírtak szerint módosíthatja az elrendezést összetevőnként vagy mappánként. Javasoljuk, hogy az Router összetevővel állítsa be az alkalmazás alapértelmezett elrendezését, mert ez az elrendezések használatának legszabályosabb és legrugalmasabb módszere.
Elrendezés alkalmazása tetszőleges tartalomra (LayoutView
összetevőre)
Ha tetszőleges Razor sablontartalomhoz szeretne elrendezést beállítani, adja meg az elrendezést egy LayoutView összetevővel. Bármelyik Razor összetevőben használhatja a LayoutView-t. Az alábbi példa egy ErrorLayout
nevű elrendezési összetevőt állít be az MainLayout
összetevő NotFound sablonhoz (<NotFound>...</NotFound>
).
<Router ...>
<Found ...>
...
</Found>
<NotFound>
<LayoutView Layout="typeof(ErrorLayout)">
<h1>Page not found</h1>
<p>Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
Előfordulhat, hogy meg kell adnia az elrendezés névterét a .NET-verziótól és a Blazor alkalmazás típusától függően. A további információkért lásd a Az elrendezés névterének elérhetővé tétele szakaszt.
Fontos
A Blazor Web Appnem használja a NotFound paramétert (<NotFound>...</NotFound>
jelölés), de a visszamenőleges kompatibilitást a paraméter biztosítja, elkerülve a keretrendszer inkompatibilis változásait. A kiszolgálóoldali ASP.NET Core köztes szoftverfolyamat feldolgozza a kiszolgálón lévő kéréseket. Használjon kiszolgálóoldali technikákat a hibás kérések kezeléséhez. További információ: ASP.NET Core Blazor renderelési módok.
Jegyzet
A ASP.NET Core 5.0.1 kiadásával és minden további 5.x kiadás esetén a Router
összetevő tartalmazza a PreferExactMatches
paramétert @true
. További információért lásd: Migrálás az ASP.NET Core 3.1-ről 5.0-ra.
Beágyazott elrendezések
Az összetevők hivatkozhatnak egy olyan elrendezésre, amely más elrendezésre hivatkozik. A beágyazott elrendezések például többszintű menüstruktúrák létrehozására szolgálnak.
Az alábbi példa a beágyazott elrendezések használatát mutatja be. A "Elrendezés alkalmazása egy összetevőre" szakaszban látható Episodes
komponens az, amely megjelenik. Az összetevő a DoctorWhoLayout
összetevőre hivatkozik.
Az alábbi DoctorWhoLayout
összetevő a jelen cikkben korábban bemutatott példa módosított verziója. Az élőfej és az élőláb elemei el lesznek távolítva, és az elrendezés egy másik elrendezésre hivatkozik, ProductionsLayout
. A Episodes
összetevő megjelenik, ahol a @Body
a DoctorWhoLayout
-ben jelenik meg.
DoctorWhoLayout.razor
:
@inherits LayoutComponentBase
@layout ProductionsLayout
<PageTitle>Doctor Who® Database</PageTitle>
<h1>Doctor Who® Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/ https://www.bbc.com";
}
@inherits LayoutComponentBase
@layout ProductionsLayout
<PageTitle>Doctor Who® Database</PageTitle>
<h1>Doctor Who® Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/ https://www.bbc.com";
}
@inherits LayoutComponentBase
@layout ProductionsLayout
<h1>Doctor Who™ Episode Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
@layout ProductionsLayout
<h1>Doctor Who™ Episode Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
@layout ProductionsLayout
<h1>Doctor Who™ Episode Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
@inherits LayoutComponentBase
@layout ProductionsLayout
<h1>Doctor Who™ Episode Database</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
@Body
<div>
@TrademarkMessage
</div>
@code {
public string TrademarkMessage { get; set; } =
"Doctor Who is a registered trademark of the BBC. " +
"https://www.doctorwho.tv/";
}
A ProductionsLayout
összetevő tartalmazza a legfelső szintű elrendezési elemeket, ahol az élőfej (<header>...</header>
) és az élőláb (<footer>...</footer>
) elemei már megtalálhatók. A Episodes
összetevővel rendelkező DoctorWhoLayout
ott jelenik meg, ahol @Body
jelenik meg.
ProductionsLayout.razor
:
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
@inherits LayoutComponentBase
<header>
<h1>Productions</h1>
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
@Body
<footer>
Footer of Productions Layout
</footer>
Az alábbi renderelt HTML-kódot az előző beágyazott elrendezés állítja elő. A felesleges jelölések nem kerülnek felhasználásra, hogy az érintett három összetevő által biztosított beágyazott tartalomra összpontosíthasson.
- A fejléc (
<header>...</header>
), a gyártási navigációs sáv (<nav>...</nav>
) és a lábléc (<footer>...</footer>
) elemei és tartalma aProductionsLayout
összetevőből származik. - A H1 "adatbázis" címsora (
<h1>...</h1>
), epizód navigációs sávja (<nav>...</nav>
) és védjegyadatai (<div>...</div>
) aDoctorWhoLayout
összetevőből származnak. - A H2 "epizódok" címsora (
<h2>...</h2>
) és az epizódlista (<ul>...</ul>
) aEpisodes
összetevőből származik.
<header>
...
</header>
<nav>
<a href="main-production-list">Main Production List</a>
<a href="production-search">Search</a>
<a href="new-production">Add Production</a>
</nav>
<h1>...</h1>
<nav>
<a href="main-episode-list">Main Episode List</a>
<a href="episode-search">Search</a>
<a href="new-episode">Add Episode</a>
</nav>
<h2>...</h2>
<ul>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<div>
...
</div>
<footer>
...
</footer>
Razor Pages-elrendezés megosztása integrált összetevőkkel
Ha az útvonalazható összetevők integrálva vannak egy Razor Pages-alkalmazásba, az alkalmazás megosztott elrendezése használható az összetevőkkel. További információ: ASP.NET Core Razor-összetevők integrálása MVC-vel vagy Razor Pages.
Szakaszok
Ha gyermek Razor összetevőből szeretné szabályozni az elrendezés tartalmát, tekintse meg ASP.NET Core Blazor szakaszokat.