Seu próximo nível começa aqui
Seu desenvolvimento não pode ter limites. Garanta sua Assinatura Ilimitada e libere uma preparação completa com os melhores professores do Brasil.
Após análise de uma solicitação, chegou-se à conclusão de...
1
Q2699907
Teclas de Atalhos
Compartilhar
Após análise de uma solicitação, chegou-se à conclusão de que seria necessário construir um novo componente. Esse novo componente deve atender aos critérios abaixo:
I - Receber uma propriedade selecionado que deverá inicializar o valor de um estado estaSeIecionado e caso seu valor seja verdadeiro deverá atribuir uma classe selecionado ao elemento principal deste componente;
II - Receber uma propriedade texto que será apresentada dentro do elemento principal deste componente;
III - Não deve apresentar os elementos filhos do componente;
IV - Ao dicar no componente, deverá alternar de true para false ou de false para true o valor do estado estaSelecionado.
Segue um exemplo do uso do elemento <Questao seledonado={true} texto="Qual é a comida que liga e desliga?" /
Considerar que o arquivo onde o componente está sendo desenvolvido tem um import React from "react"; na primeira linha.
Assinale a alternativa que contemple todos os critérios acima:
A
const Questão = ({ selecionado, texto }) => { -const [estaSelecionado, setEstaSelecionado] = React.useState(selecionado); -return ( --<div ---className={estaSelecionado ? "selecionado" : ""} ---onClick={() => { ----setEstaSelecionado(!estaSelecionado); ---}}> ---{texto} --</ -); }; |
B
-const Questão = (selecionado, texto) => { --const [estaSelecionado, setEstaSelecionado] = -React.useEffect(selecionado); --return ( ----<div ------className={estaSelecionado ? "selecionado" : ""} ------onClick={() => { --------setEstaSelecionado(!estaSelecionado) ; ------}}> ------{texto} ----</ ---); -}; |
C
-const Questão = ({children}) => { --const [estaSelecionado, setEstaSelecionado] = -React.useEffect(children.selecionado); --return ( ---<div ----className=:{estaSelecionado ? "selecionado" : ''} ----onClick={() => { -----setEstaSelecionado(!estaSelecionado); ----}}> ----{chiIdren.texto} ---</ --); -}; |
D
const Questão = ({selecionado, children}) => { -const [estaSelecionado, setEstaSelecionado] = React.useState(selecionado); -return ( --<div ----className={estaSelecionado ? "selecionado" : ''} ----onClick={() => { -----setEstaSelecionado(!estaSelecionado); ----}}> ----{children} ---</ --); }; |
E
const Questão = ({ selecionado, texto }) => { -const [estaSelecionado, setEstaSelecionado] = -------React.useState(React.useContext(selecionado) ) ; -return ( --<div ---className={estaSelecionado ? "selecionado" : "'} ---onClick={() => { ----setEstaSelecionado(!estaSelecionado); ---}}> ---{React.useContext(texto)} --</ -); }; |