Neste artigo iremos explorar o recurso de Referências de Componentes que temos no Blazor. Os exemplos exibidos nesse artigo são baseados na aplicação de exemplo criada nesse artigo aqui com o Visual Studio, e nesse outro aqui com o VSCode.
ref
Uma forma de se comunicar com componentes é através de referências criadas no seu código C#.
Uma referência é basicamente um atributo declarado no componente, que deve ter o mesmo nome usado no atributo HTML ref, que deve ser colocado na tag do componente.
Confira na Figura 1 um exemplo de como criar uma referência à um Componente. Nesse exemplo estamos criando uma referência ao componente TesteRef.razor.

Usando uma referência
Na Figura 1 você pode ver que o atributo declarado para a referência, precisa ser do mesmo tipo do componente declarado no HTML.
Com isso, através dessa referência, temos acesso à todos os elementos públicos do componente. No próprio exemplo da Figura 1, estamos usando a referência para chamar o método ExibirMensagem do componente TesteRef.
Veja na Figura 2 o código do componente TesteRef, incluindo o seu método ExibirMensagem.

O método ExibirMensagem do componente TestRef, simplesmente recebe uma string e atribuí o seu valor à propriedade Mensagem, que será exibida no HTML do componente.
Atenção! Até a versão atual do Blazor (preview 5), para que o Componente seja atualizado na chamada do método pela sua referência, foi necessário chamar o método StateHasChanged do componente, para forçar uma atualização da sua interface.
Testando
Execute o exemplo e veja, como mostra a Figura 3, que podemos chamar um método de um componente através de sua referência.

Grande Abraço e até o próximo!
Um comentário em “Referências de Componentes no Blazor”