Utilizziamo i cookie per analisi, contenuti personalizzati e pubblicità.

Queste informazioni possono essere condivise con i nostri partner per fornire i servizi necessari.

Approfondisci

AccettoRifiuto

Dall'archivio articoli > ASP.NET Core

Le novità di Blazor in .NET 6.0

di Morgan PizziniMorgan Pizzini, in ASP.NET Core,

Il rilascio della nuova versione di .NET, la 6.0, è ormai avvenuto. Tra le novità più conosciute e mediaticamente diffuse è l'introduzione delle Minimal API, che alleggeriscono lo sviluppo back-end. Tuttavia, troviamo dunque degli aggiornamenti importanti anche per quanto riguarda Blazor, alcuni dei quali provengono dall'ottimizzazione dell'infrastruttura, altri da specifici sviluppi che permettono di avere funzionalità aggiuntive. Ed è proprio su questi che vogliamo concentrarci in quest'articolo.

Prima di addentrarci nello specifico facciamo un veloce riepilogo della roadmap di .NET rapportata con Blazor.

Figura 1

Stando a quanto dichiarato da Microsoft, ogni versione marcata come LTS ha un supporto di 3 anni, ogni altra versione che può essere rilasciata durante questo periodo di tempo, prendendo il nome Current, verrà supportata per 18 mesi. Questo schema è importantissimo, soprattutto per chi sviluppa quotidianamente con Blazor, tenendo conto che il primo rilascio della versione Server è avvenuto in concomitanza con .NET Core 3.1 e per WebAssembly abbiamo dovuto aspettare fino a Maggio 2020, sempre nel range .NET Core 3.1.

Perchè è dunque importante specificare queste date di rilascio? Il motivo è semplice e risiede nel rilascio della prima versione di .NET 5.0, nella quale sono stati fatti enormi passi avanti, che hanno portato tutti gli sviluppatori a migrare quello che è il target framework. Ritornando ora al grafico possiamo capire che se utiliziamo Blazor, in produzione, abbiamo circa 6 mesi di tempo per effettuare una migrazione verso .NET 6.0 e riuscire ad estendere il supporto per almeno altri 3 anni. Essendo nell'ecosistema Microsoft non dobbiamo però preoccuparci: a oggi le breaking change segnalate sono solo 3, e riguardano rispettivamente un typo all'interno di un metodo, un cambiamento nella comunicazione interna di Blazor, che non va ad incidere sul nostro codice e il cambiamento di codifica dei byte array durante le interop, ossia le operazioni che avvengono tra Blazor e JavaScript.

Impostare i parametri in query string

Gli aggiornamenti che troviamo in Blazor possono essere suddivisi in due macro categorie: nuove funzionalità e integrazioni con terze parti. Per la prima possiamo subito osservare due nuovi metodi che estendono la funzionalità di NavigationManager. GetUriWithQueryParameter e GetUriWithQueryParameters permettono, partendo dall'url corrente, di creare un url che contenga i parametri query string specificati. Particolarmente utile in pagine contenenti tabelle, permettendo l'aggiornamento del link alla pagina a seguito di un'interazione dell'utente. Nella versione al singolare permette l'immissione di un nome per il parametro e il suo valore, nel caso di inserimenti multipli dovremmo creare un dizionario che contenga chiave/valore.

@inject NavigationManager NavigationManager

var newUri = NavigationManager.GetUriWithQueryParameter("page", 3);
var newUriComplex = NavigationManager.GetUriWithQueryParameters(new Dictionary<string, object?>
{
    { "page",2},
    { "take",10},
});

NavigationManager.NavigateTo(newUri);

Integrazione eventi generati dal mouse

All'interno di un evento scaturito da un click vi sono parecchie proprietà, e non tutte erano state intercettate e rese disponibile in Blazor. Tra le altre troviamo la posizione X e Y del mouse. Per questo motivo, all'interno dell'evento MouseEventArgs troviamo due nuove proprietà: PageX e PageY.

<button @onclick="ClickHandler">Click Top</button>
<button @onclick="ClickHandler">Click Bot</button>

@code {
    private void ClickHandler(MouseEventArgs e)
    {
        // capiamo il bottone cliccato sulla base della posizione
    }
}

Impostare il titolo della pagina

In Blazor è da sempre stato molto chiaro come impostare la route di una pagina, mentre non esisteva un modo diretto per modificare il titolo della stessa, analogo per esempio a ViewBag.Title di ASP.NET MVC. Per arrivare a questo scopo sono venute in suporto implementazioni custom e librerie, ma da oggi sarà possibile impostare il titolo seguendo due semplici step, già implementati nel template di default:

// program.cs
using Microsoft.AspNetCore.Components.Web;
builder.RootComponents.Add<HeadOutlet>("head::after");

Inserendo HeadOutlet chiediamo a Blazor di tenere in sincronia il nome specificato in ogni singola pagina con il tag title presente nell'head e di conseguenza il nome nella tab del browser. All'interno di ogni pagina dovremmo solo aggiungere l'elemento PageTitle e impostarne il valore

<PageTitle>Titolo pagina</PageTitle>
3 pagine in totale: 1 2 3
Contenuti dell'articolo

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn
Aggiorna

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

Top Ten Articoli

Articoli via e-mail

Iscriviti alla nostra newsletter nuoviarticoli per ricevere via e-mail le notifiche!

In primo piano

.NET Conference Italia 2024 - Milano

.NET Conference Italia 2023 - Milano e Online

Le novità di .NET 7 e C# 11

Le novità in ASP.NET Core e Blazor con .NET 7

I più letti di oggi

In evidenza

Misc