© best_vector/Shutterstock.com
ASP.NET Core Blazor WebAssembly und Blazor Server

Spickzettel zu Blazor


Softwarearchitektur

Blazor_ServerVSWebAssembly.tif_fmt1.jpg

Wichtigste Namensräume für Blazor-Anwendungen

using Microsoft.AspNetCore.Authorization; using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components.Authorization; using Microsoft.AspNetCore.Components.Forms; using Microsoft.AspNetCore.Components.Rendering; using Microsoft.AspNetCore.Components.Routing using Microsoft.AspNetCore.Components.Web; using Microsoft.JSInterop; using System.Net.Http; using System.Net.Http.Json;

Startup-Code für Blazor WebAssembly

index.html:

<app>Loading …</app> <script src="_framework/blazor.webassembly.js"></script>

Verzögerter Start mit autostart="false" und window.Blazor.start()

Program.cs:

var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.RootComponents.Add<App>("app"); await builder.Build().RunAsync();

Startup-Code für Blazor Server

_host.cshtml:

<app><component type="typeof(App)" render-mode="ServerPrerendered" /></app> <script src="_framework/blazor.server.js"></script>

Verfügbare Modi: Static, Server, ServerPrerendered

Startup.cs:

services.AddServerSideBlazor().AddCircuitOptions(o => { if (this.Env.IsDevelopment()) { o.DetailedErrors = true; } });

Globale Imports _imports.razor

Einbindung von Namensräumen mit @ using oder Dependency Injections (@ inject), die in allen Razor Components zur Verfügung stehen sollen. Sonstiger C#- sowie HTML-Code sind nicht erlaubt.

@using MeineBusinessLogik @using Microsoft.AspNetCore.Components @using Microsoft.JSInterop @inject NavigationManager NavigationManager @inject IJSRuntime JsRuntime

Razor Component ohne Code-Behind

Name razor:

<div>…</div> @code { … }

Razor Component mit Code-Behind per Partial Class

Name.razor:

<div>…</div>

Name.razor.cs:

namespace Ordner.Unterordner { public partial class Name { … } }

Razor Component mit Code-Behind per Vererbung

Name.razor:

@inherits Namensraum.NameModel; <div>…</div>

Name.razor.cs:

namespace Namensraum { public partial class NameModel { … } }

Razor Component nur mit C#-Code

Name.cs:

public partial class CodeOnlyComponent : ComponentBase { protected override void BuildRenderTree(RenderTreeBuilder builder) { builder.AddMarkupContent(0, "<h2>Text</h2>"); } }

Routing und URL-Parameter

Seitendirektive mit Route:

@page "/a/b"

Seitendirektive mit Route und Parametern:

@page "/a/b/{x}/{y}"

Seitendirektive mit Route und typisierten Parametern:

@page "/a/b/{x:int}/{y:guid}"

Erlaubte Datentypen:

bool, datetime, decimal, double, float, guid, int, long

Optionale Parameter (mit ?) und Standar...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang