Quando um grande número de páginas chama o mesmo resultado de visualização, podemos encapsular o mesmo conteúdo em um componente de visualização, claro, também podemos passar parâmetros para o componente de visualização e retornar o resultado da resposta, cenários: rankings, formulários, tabelas, etc. Este artigo usa asp.net núcleo 3.1 para explicar como usar o tutorial do componente de visualização do ViewComponent.
Componentes de visualização
O componente View é semelhante a uma view local, mas mais poderoso. O componente view não utiliza bindings de modelo, mas apenas se baseia nos dados fornecidos quando o modelo é chamado. Este artigo foi escrito usando controladores e views, mas o componente view também pode ser usado com Razor Pages.
Veja Componentes:
- Renderize blocos em vez da resposta inteira.
- Inclui a mesma separação de preocupações e benefícios de testabilidade encontrados entre controladores e views.
- Pode ter parâmetros e lógica de negócios.
- Normalmente é chamado pela página de layout.
Componentes de view podem ser usados em qualquer lugar onde você tenha uma lógica de renderização reutilizável que seja complexa demais para uma view local, como:
- Menu de navegação dinâmica
- Nuvem de tags (onde o banco de dados é consultado)
- Painel de login
- Carrinho de compras
- Artigos publicados recentemente
- Conteúdo na barra lateral em um blog típico
- O painel de login aparecerá em cada página com um link para sair ou login, dependendo do status de login do usuário
Visão parcial
No asp.net MVC 5, podemos usar uma visualização local com o seguinte código:
Método de chamada:
ViewComponent é uma alternativa às visualizações locais.
ViewComponent para começar
Ver classe de componente:
- A injeção de dependência de construtores é totalmente suportada
- Não está envolvido no ciclo de vida do controlador, o que significa que você não pode usar filtros nos componentes da visualização
- Sem mais delongas, vamos direto ao ponto em que queremos encapsular a funcionalidade componente de uma classificação de área urbana.
Primeiro, crie uma nova pasta "ViewComponents" sob o diretório do projeto e crie um novo arquivo de classe "RootClassification.cs" com o seguinte código:
Na página de visualização, criamos uma nova pasta "Components" sob a pasta "/Views/Shared" do projeto, depois criamos uma nova pasta "RootClassification" (este é o objeto com a nova classe component que criamos), e então criamos um novo arquivo "Default.cshtml", cujo código é o seguinte:
A estrutura é a seguinte:
O caminho detalhado é: /Views/Shared/Components/RootClassification/Default.cshtml
Por que construir esse caminho? Isso tem a ver com o funcionamento do componente asp.net Core.
O runtime busca a visualização pelo seguinte caminho:
/Views/{Controller Name}/Components/{View Component Name}/{View Name}
/Views/Shared/Components/{View Component Name}/{View Name}
/Pages/Shared/Components/{View Component Name}/{View Name}
O nome padrão da visualização para o componente view é Default, o que significa que seu arquivo de visualização geralmente será chamado Default.cshtml. Ao criar um resultado de um componente de visualização ou chamar um método de View, você pode especificar um nome diferente de visualização.
Chamando, podemos chamar onde precisamos usar o componente, o código é o seguinte:
Reexecute o projeto com a seguinte renderização:
|
Postado em 2021-2-7 16:18:25
|
|
|
|
Postado em 2021-8-12 10:21:01
|
Senhorio|
Postado em 13-08-2023 17:55:05
|
