asp.net-core
Ver componentes

Crear un componente de vista

Los componentes de vista encapsulan piezas reutilizables de lógica y vistas. Están definidos por:

• Una clase ViewComponent que contiene la lógica para obtener y preparar los datos para la vista y decidir qué vista se va a representar.
• Una o mas vistas

Ya que contienen lógica, son más flexibles que las visiones parciales y al mismo tiempo promueven una buena separación de preocupaciones.

Un componente de vista personalizado simple se define como:

public class MyCustomViewComponent : ViewComponent
{        
    public async Task<IViewComponentResult> InvokeAsync(string param1, int param2)
    {
        //some business logic

        //renders ~/Views/Shared/Components/MyCustom/Default.cshtml
        return View(new MyCustomModel{ ... });
    }
}

@*View file located in ~/Views/Shared/Components/MyCustom/Default.cshtml*@
@model WebApplication1.Models.MyCustomModel
<p>Hello @Model.UserName!</p>

Se pueden invocar desde cualquier vista (o incluso un controlador devolviendo un ViewComponentResult )

@await Component.InvokeAsync("MyCustom", new {param1 = "foo", param2 = 42})

Iniciar sesión Ver componente

La plantilla de proyecto predeterminada crea una vista parcial _LoginPartial.cshtml que contiene un poco de lógica para averiguar si el usuario ha iniciado sesión o no y averiguar su nombre de usuario.

Dado que un componente de vista podría ser un mejor ajuste (ya que hay lógica involucrada e incluso 2 servicios inyectados), el siguiente ejemplo muestra cómo convertir el LoginPartial en un componente de vista.

Ver clase de componente

public class LoginViewComponent : ViewComponent
{
    private readonly SignInManager<ApplicationUser> signInManager;
    private readonly UserManager<ApplicationUser> userManager;

    public LoginViewComponent(SignInManager<ApplicationUser> signInManager, UserManager<ApplicationUser> userManager)
    {
        this.signInManager = signInManager;
        this.userManager = userManager;
    }

    public async Task<IViewComponentResult> InvokeAsync()
    {
        if (signInManager.IsSignedIn(this.User as ClaimsPrincipal))
        {                
            return View("SignedIn", await userManager.GetUserAsync(this.User as ClaimsPrincipal));
        }
        return View("SignedOut");
    }
}

Vista SignedIn (en ~ / Vistas / Compartido / Componentes / Login / SignedIn.cshtml)

@model WebApplication1.Models.ApplicationUser

<form asp-area="" asp-controller="Account" asp-action="LogOff" method="post" id="logoutForm" class="navbar-right">
    <ul class="nav navbar-nav navbar-right">
        <li>
            <a asp-area="" asp-controller="Manage" asp-action="Index" title="Manage">Hello @Model.UserName!</a>
        </li>
        <li>
            <button type="submit" class="btn btn-link navbar-btn navbar-link">Log off</button>
        </li>
    </ul>
</form>

Vista SignedOut (en ~ / Vistas / Compartido / Componentes / Login / SignedOut.cshtml)

<ul class="nav navbar-nav navbar-right">
    <li><a asp-area="" asp-controller="Account" asp-action="Register">Register</a></li>
    <li><a asp-area="" asp-controller="Account" asp-action="Login">Log in</a></li>
</ul>

Invocación desde _Layout.cshtml

@await Component.InvokeAsync("Login")

Regreso de la acción del controlador

Cuando se hereda de la clase de Controller base proporcionada por el marco, puede usar el método de conveniencia ViewComponent() para devolver un componente de vista desde la acción:

public IActionResult GetMyComponent()
{
    return ViewComponent("Login", new { param1 = "foo", param2 = 42 });
}

Si utiliza una clase POCO como controlador, puede crear manualmente una instancia de la clase ViewComponentResult . Esto sería equivalente al código anterior:

public IActionResult GetMyComponent()
{
    return new ViewComponentResult 
    { 
        ViewComponentName = "Login",
        Arguments = new { param1 = "foo", param2 = 42 } 
    };
}