Salve galera!
Continuando com as novidades do Blazor no relase do .NET Core 3.0 Preview 8, vamos as alterações de código!
Case-sensitive component binding
A partir desta versão, os componentes criados através de arquivos com a extensão .razor são sensíveis a caixa alta / baixa.
Por que isso? Antes, se fosse necessário criar um componente Button, por exemplo, com funcionalidades extras, estilizado como um botão primário, teríamos conflito com o elemento <button> do HTML. Agora que foi habilitado o "case-sensitive" para componentes, não temos mais esse problema.
Abaixo o exemplo que foi utilizado no Blog do ASP.NET Core, onde usamos uma tag <button> dentro dele e algumas funcionalidades extras, como incrementar um contador.
Agora, um teste para você fazer… Tente renomear seu componente de Buttton para button, ajuste o nome no arquivo Count.razor e tente compilar seu projeto. Você terá um erro como o da imagem a seguir, informando que seus componente não pode ser todo em letras minúsculas devido a conflito com o HTML.
NavLink atualizado para suportar atributos extras
O component NavLink, parte do Blazor, agora suporta parâmetros adicionais para serem renderizados com a tag de âncora <a>. Antes tínhamos suporte para os atributos href e class, mas agora podemos especificar qualquer um. Veja os exemplos onde podemos adicionar o target:
<NavLink href="my-page" target="_blank">My page</NavLink>
E isso irá produzir:
<a href="my-page" target="_blank" rel="noopener noreferrer">My Page</a>
Data binding considerando a cultura atual
O suporte a data binding (@bind) para o elemento <input> agora suporta cultura. Os valores podem ser formatados e "parseados" de acordo com a cultura atual, identificada pela propriedade System.Globalization.CultureInfo.CurrentCulture
Isso quer dizer que, o data binding do elemento vai formatar e converter de forma correta quando a cultura do usuário for a mesma que a atual para o ambiente de runtime, onde podemos configurar utilizando um Middleware para localization no ASP.NET Core. Também podemos especificar a cultura a ser utilizada em um data binding, com o parâmetro @bind:culture, onde o valor do parâmetro é uma instância da classe CultureInfo.
Para fazer um binding ignorando a cultura (InvariantCulture), podemos fazer:
<input @bind="amount" @bind:culture="CultureInfo.InvariantCulture" />
Os elementos <input> do tipo number e date irão utilizar por padrão a cultura invariante (CultureInfo.InvarianteCulture) e regras de formatação de acordo com o browser. Esses elementos não podem conter texto digitado sem formatação e a aparência deles é controlada pelo browser.
Outros tipos de campo com regras específicas de formatação são datetime-local, month e week. Esses campos ainda não suportados pelo Blazor, dado que também não suportados pela maioria dos browsers.
Outro ponto importante é que o data binding agora também suporta os tipos DateTimeOffset, DateTime? e DateTimeOffset? (?, tipos nuláveis suportados).
Suporte do Razor Pages a diretiva @attribute
O Razor Pages (consequentemente Blazor também) agora suporta a diretiva @attribute, para adicionar atributos a classe gerada para a página.
Podemos, por exemplo, especificar que a página precisa ter autorização validada, como a seguir:
@page
@attribute [Microsoft.AspNetCore.Authorization.Authorize]
<h1>Authorized users only!<h1>
<p>Hello @User.Identity.Name. You are authorized!</p>
Concluindo
Estas foram as últimas novidades deste release, diretamente relacioandas ao Blazor.
Temos algumas novidades extras, mais gerais do ASP.NET Core que do Blazor, que serão apresentadas na terceira parte desta série.
Referências
Este post tem como referência / faz tradução ao post original sobre o release do .NET Core 3.0 Preview 8, disponível em:
https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-8/
Top comments (0)