Cómo pasar un argumento a un controlador desde un componente de Blazor
En Blazor, puedes pasar argumentos a un controlador en una aplicación ASP.NET utilizando HttpClient para enviar solicitudes HTTP. Esto es útil para interactuar con API y enviar datos desde un componente Blazor a un backend en ASP.NET Core.
Uso de HttpClient para enviar datos
Para pasar un argumento a un controlador desde un componente Blazor, puedes usar HttpClient con una solicitud GET o POST.
1. Configurar el servicio HttpClient
En el archivo Program.cs, asegúrate de registrar HttpClient:
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri("https://tuapi.com/") });2. Enviar un argumento desde un componente Blazor
En un componente .razor, puedes inyectar HttpClient y enviar el argumento al controlador.
Ejemplo con método GET
@inject HttpClient Http
<button @onclick="EnviarDato">Enviar</button>
@code {
private async Task EnviarDato()
{
string parametro = "miValor";
var respuesta = await Http.GetAsync($"api/controlador?dato={parametro}");
if (respuesta.IsSuccessStatusCode)
{
Console.WriteLine("Dato enviado correctamente.");
}
}
}Ejemplo con método POST
@inject HttpClient Http
<button @onclick="EnviarDato">Enviar</button>
@code {
private async Task EnviarDato()
{
var dato = new { Nombre = "Ejemplo" };
var respuesta = await Http.PostAsJsonAsync("api/controlador", dato);
if (respuesta.IsSuccessStatusCode)
{
Console.WriteLine("Dato enviado correctamente.");
}
}
}Controlador en ASP.NET Core
En el backend, el controlador debe manejar la solicitud:
[ApiController]
[Route("api/controlador")]
public class MiControlador : ControllerBase
{
[HttpGet]
public IActionResult ObtenerDato([FromQuery] string dato)
{
return Ok($"Recibido: {dato}");
}
[HttpPost]
public IActionResult RecibirDato([FromBody] MiModelo modelo)
{
return Ok($"Recibido: {modelo.Nombre}");
}
}
public class MiModelo
{
public string Nombre { get; set; }
}Conclusión
Blazor permite pasar argumentos a un controlador en ASP.NET Core usando HttpClient, ya sea con GET o POST. Esto facilita la comunicación entre el frontend y el backend en aplicaciones web modernas.
Jorge García
Fullstack developer