ASP.NET MVC 3 e a sintaxe @helper dentro do Razor


A ASP.NET MVC 3 vem com uma nova opção de motor de visões chamada "Razor" (além de continuar a suportar/melhorar o motor de visões .aspx existente). O Razor minimiza o número de caracteres e teclas pressionadas ao escrever um modelo de visão, e permite um fluxo de trabalho de codificação rápido e fluído.

Ao contrário da maioria das sintaxes de modelos, você não precisa interromper sua codificação para indicar explicitamente o início e o fim de blocos do servidor dentro do seu código HTML. O analisador do Razor é inteligente o suficiente para deduzir esses blocos a partir do seu código. Isto permite uma sintaxe muito compacta e expressiva, que é limpa, rápida e divertida para digitar.

Você pode aprender mais sobre o Razor a partir de alguns dos posts que escrevi sobre ele ao longo dos últimos 9 meses:

O post de hoje abrange um recurso interessante do Razor que muitas pessoas não conhecem - que é a capacidade de definir métodos de ajuda reutilizáveis ​​usando a sintaxe @helper.

Cenário simples com um método @helper

A sintaxe @helper dentro do Razor permite que você facilmente crie métodos de ajuda reusáveis ​​que podem encapsular funcionalidades de geração de código dentro de seus modelos de visão. Eles permitem uma melhor reutilização de código e também podem facilitar sua vida com a obtenção de um código mais legível. Vejamos um cenário super-simples de como a sintaxe @helper pode ser usada. 

Código antes de definirmos um método @helper

Vejamos um cenário simples de listagem de produtos, onde listamos os detalhes de um produto, e geramos uma saída com o preço do produto - ou a palavra "FREE!" (Grátis!) se o item não custa nada:

imagem

O código acima é bem simples e direto, e a sintaxe do Razor torna fácil integrar código C# do servidor dentro do código HTML. 

Um lugar que é um pouco confuso, porém, é a lógica if/else para o preço do preço. Vamos provavelmente gerar o código para o preço do produto em algum outro lugar dentro do site (ou dentro da mesma página), e duplicar a lógica acima em todos os lugares seria propenso a erros e difícil de manter. Cenários como esse são os principais candidatos para extrairmos e refatorarmos em métodos de ajuda usando a sintaxe @helper.

Refatorando o exemplo acima usando a sintaxe @helper

Vamos extrair a lógica de geração de código de saída para o preço do produto, encapsulando a mesma dentro de um método de ajuda que nomearemos como "DisplayPrice". Podemos fazer isso reescrevendo o exemplo com o código mostrado a seguir:

imagem

Nós usamos a sintaxe @helper para definirmos um método de ajuda reusável chamado "DisplayPrice". Assim como um método padrão C#/VB, ele pode conter qualquer número de argumentos (você também pode definir os argumentos para que sejam anuláveis ou opcionais). Ao contrário dos métodos padrão C#/VB, no entanto, métodos de ajuda @helper podem conter tanto conteúdo e código, e suportam a sintaxe completa do Razor dentro deles - o que torna muito fácil definir e encapsular métodos de ajuda para renderização/formatação de dados:

SNAGHTML20fae4df

Você pode chamar métodos @helper como se fosse chamar um método padrão C# ou VB:

SNAGHTML20fcdc86

O Visual Studio irá prover intellisense quando você chamar o método:

imagem

Reusando @helpers em múltiplas visões

No exemplo acima, definimos o nosso método de ajuda @helper dentro do mesmo modelo de visão que o chamou. Alternativamente, podemos definir o método @helper fora do nosso modelo de visão, permitindo que o mesmo seja reutilizado em todos os modelos de visão do nosso projeto.

Podemos fazer isso, salvando nossos métodos @helper em arquivos .cshtml/.vbhtml que são colocados dentro um diretório \App_Code que você cria na raiz de um projeto. Por exemplo, a seguir eu criei um arquivo "ScottGu.cshtml" dentro da pasta \App_Code, e defini dois métodos de ajuda dentro do arquivo (você pode ter qualquer número de métodos de ajuda dentro de cada arquivo):

SNAGHTML2107b6ae

Uma vez que nossos métodos de ajuda são definidos no nível da aplicação, podemos usá-los dentro de qualquer modelo de visão da nossa aplicação. 

O modelo ScottGu.cshtml na pasta \App_Code acima será logicamente compilado para uma classe chamada "ScottGu" com membros estáticos "DisplayPrice" e "AnotherHelper" dentro dela. Podemos re-escrever nosso exemplo anterior para chamar os métodos de ajuda dessa classe, utilizando o código a seguir:

SNAGHTML210d65c1

O Visual Studio irá prover intellisense quando chamarmos os métodos de ajuda do nível da aplicação como mostrado a seguir:

imagem

Sumário

A sintaxe @helper do Razor fornece uma maneira conveniente para encapsular funcionalidade de renderização de dados em métodos de ajuda que você pode reusar dentro modelos de visão individuais, ou em todos os modelos de visão dentro de um projeto. 

Você pode usar essa funcionalidade para escrever código que é ainda mais limpo e de fácil manutenibilidade. 

Espero que ajude,

Scott

P.S. Além do blog, eu também estou utilizando o Twitter para atualizações rápidas e para compartilhar links. Siga-me em: twitter.com/ScottGu

 

Texto traduzido do post original por Leniel Macaferi.

2 Comments

Comments have been disabled for this content.