Crie seu primeiro aplicativo Web com o ASP.NET Core usando o Blazor

Windows Linux macOS

Modificar um componente

Os parâmetros de componente são especificados usando atributos ou conteúdo filho, que permitem definir propriedades no componente filho. Defina um parâmetro no componente Counter para especificar o quanto ele é incrementado a cada clique no botão:

  • Adicione uma propriedade pública para IncrementAmount com um atributo [Parameter].
  • Altere o método IncrementCount para usar IncrementAmount ao incrementar o valor de currentCount.

O código a seguir mostra como obtê-lo. As linhas realçadas mostram as alterações.

Components/Pages/Counter.razor
@page "/counter"
@rendermode InteractiveServer

<PageTitle>Counter</PageTitle>

<h1>Counter</h1>

<p role="status">Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {
    private int currentCount = 0;

    [Parameter]
    public int IncrementAmount { get; set; } = 1;

    private void IncrementCount()
    {
        currentCount += IncrementAmount;
    }
}

Em Home.razor, atualize o elemento <Counter> para adicionar um atributo IncrementAmount que altera o valor do incremento para dez, conforme mostrado pela linha realçada no código a seguir:

Components/Pages/Home.razor
@page "/"

<PageTitle>Home</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<Counter IncrementAmount="10" />

Aplique a alteração no aplicativo ao clicar no botão Recarga Dinâmica. O componente Home já tem seu respectivo contador que aumenta em dez cada vez que o botão Click me é selecionado, conforme mostrado na imagem a seguir. O componente Counter (Counter.razor) no /counter continua a ser incrementado em um.

O componente Home já tem seu respectivo contador que aumenta em dez cada vez que o botão Click me é selecionado, conforme mostrado na imagem a seguir. O componente Counter (Counter.razor) no /counter continua a ser incrementado em um.

Agora a página inicial contém um Contador com incrementos de 10 mostrando o contador em 40.

Continuar