Baixe o app para aproveitar ainda mais
Prévia do material em texto
Aula 14 - Eventos no React 1. Para um desenvolvedor criar um aplicativo que interaja com o usuário, quando ele clicar em um botão, é necessário tratar os eventos do botão. Marque a opção que representa um evento de botão em um programa front end: Resposta: E. onClick(). Justificativa: O evento de botão que captura o clique do mouse no botão é o onClick. Nenhuma das outras opções contém um evento válido. 2. Para programar eventos, é necessário conhecer as diferenças sutis existentes entre os eventos DOM e os eventos React, como a forma de escrever os eventos e seus manipuladores. Dado o seguinte trecho de código: <a href="#" onclick="alert('Link clicado!'); return false">Clique Aqui</a> marque a opção correta. Resposta: C. Ao clicar no link, é aberto um alerta. Justificativa: Ao clicar no link, é chamado o evento onclick, que abre um alerta com o texto "Link clicado!". O onclick é um evento DOM em HTML; em React seria onClick. O return false evita o comportamento padrão do navegador. O trecho de código é em HTML e JavaScript. Por conta do false, o link não redirecionará para outra página. 3. Quando um evento é disparado, é possível tratá-lo para que aconteçam ações específicas dependendo do tipo do evento. Marque a opção que representa o início de um trecho de código de um manipulador de eventos: Resposta: A. btn.onclick = function() { alert(“Alerta”); } Justificativa: O código que manipula o evento é o btn.onclick, que recebe uma função que emite um alerta. O render é um método React para apresentar o botão clicar na tela. O método setState é utilizado para atualizar o estado do componente. O <input> é um elemento HTML, e não um manipulador de eventos. O método handleEvent recebendo o handleEvent.bind é utilizado para tornar o handleEvent acessível em outro local. 4. Quando um evento é disparado, ele pode ser propagado entre os métodos por meio de uma variável, com possibilidade de lançar uma exceção ou gerar erro, no caso de existirem problemas sintáticos ou semânticos no código. Analise o trecho de código a seguir e marque a opção correta: <button onClick={(e) => this.deleteRow(id, e)}>Deletar linha</button> Resposta: A. O argumento “e” representa o evento do React. Justificativa: O argumento “e“ diz respeito ao evento do React, e não representa apenas erro ou exceção. O código não contém erros semânticos ou sintáticos. https://ultra.content.blackboardcdn.com/ultra/uiv3900.74.0-rel.25_afc4ff2 5. Existem eventos genéricos para todos os navegadores, como também existem eventos específicos para determinados navegadores. Sobre os eventos DOM e React, marque a opção correta: Resposta: B. Eventos em React são escritos usando camel case. Justificativa: Os nomes dos eventos em React são escritos usando camel case, em vez de letras minúsculas. Um elemento HTML DOM pode disparar um evento, e é possível retornar false nele para prevenir a ação padrão do evento. No manipulador de eventos React, a função é passada como manipulador de eventos.
Compartilhar