11 - Vinculação de dados

Olá pessoal, essa é a décima primeira aula do treinamento de Blazor.

Nessa etapa do treinamento, vamos aprender a trabalhar vinculação de dados. Essa técnica utiliza o comando @bind para termos uma comunicação entre variáveis e elementos HTML.

Vamos exemplificar, suponha que você tenha um elemento input do tipo texto. O usuário precisa informar um CPF válido, ao digitar todos os 11 dígitos, automaticamente em um elemento de parágrafo iremos retornar se o CPF está correto ou não. Veja que instantaneamente ao digitarmos 11 números, haverá um retorno.

Para termos essa estrutura dinâmica, é utilizado o comando @bind.

O comando @bind consegue enviar o valor de uma variável para um elemento HTML, mas quando o elemento HTML sofre alguma mudança de valor, automaticamente a variável é atualizada.

Vamos ver na prática? Veja abaixo um exemplo utilizando o elemento select:

Acompanhe essa aula no YouTube: