Questão nº 46
Questão de Tecnologia da Informação · FCC TRT17 2022 (nº 46)
Considere o código abaixo, do arquivo `index.js` que faz parte de uma aplicação web criada com React, em condições ideais.
```jsx
import React from 'react';
import ReactDOM from 'react-dom/client';
function GetData() {
const GetTribunal = () => {
document.write("TRT DA 17ª REGIÃO");
}
return (
<button
I
>Ver Tribunal</button>
);
}
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<GetData />);
```
Para que, ao clicar no botão Ver Tribunal seja exibida a mensagem TRT DA 17ª REGIÃO, a lacuna I deve ser preenchida corretamente por:
- A`onClick={GetData}`
- B`onClick="GetTribunal()"`
- C`onClick="GetData() => GetTribunal()"`
- D`onClick={GetTribunal}` (alternativa correta)
- E`onClick="GetData()"`
Resposta comentada
Gabarito Alternativa D
Em React, para que um evento (como um clique) dispare uma ação, o manipulador de eventos (como onClick) deve receber uma referência a uma função JavaScript dentro de chaves {}.
- (A) Incorreta:
GetDataé o componente React. Passar o componente diretamente paraonClicknão é a forma correta de manipular eventos, pois ele espera uma função a ser executada, não um componente a ser renderizado. - (B) Incorreta: Em React JSX, atributos como
onClickesperam uma expressão JavaScript (como uma função) dentro de chaves{}. Passar uma string como"GetTribunal()"é como se faz em HTML puro, mas não em React, e não executaria a função. Esta é a armadilha mais comum para quem vem do HTML tradicional. - (C) Incorreta: Assim como na alternativa B, o valor é uma string, não uma expressão JavaScript dentro de chaves. Mesmo que fosse
{GetData() => GetTribunal()},GetData()seria chamado imediatamente e retornaria JSX, não uma função. - (D) Correta:
GetTribunalé a função que contém a lógica desejada. Ao passar{GetTribunal}, estamos fornecendo uma referência à funçãoGetTribunalpara o manipuladoronClick. Assim, quando o botão for clicado, React executará essa função. - (E) Incorreta: Semelhante às alternativas B e C, o valor é uma string. Além disso, mesmo se fosse
{GetData()},GetData()seria executado imediatamente durante a renderização e retornaria JSX, não uma função para oonClick.
Fonte: FCC TRT17 2022 Técnico Judiciário - Área Apoio Especializado - Especialidade Tecnologia da Informação (Caderno Tipo 001). Reproduzida para fins de estudo.