-
O useEffect é um tipo de hook
muito versátil.
-
Uma de suas funções
é o efeito colateral.
-
Vamos ver como funciona?
-
No projeto temos
a seguinte estrutura,
-
na pasta "components",
"Exemplo2"
-
Nosso componente "Exemplo2"
com a primeira letra maiúscula,
-
'.jsx" a sua extensão.
-
Temos a seguinte estrutura.
-
Estamos importando o hook
chamado "useRef"
-
que na verdade ele ajuda
o useEffect
-
a memorizar o que ele vai fazer
como colateral.
-
Nesse exemplo,
nós temos aqui uma função
-
que está recebendo uma constante
"selecionarRef".
-
Então, aqui é uma variável
selecionar e to passando "useRef" vazio.
-
Embaixo, eu estou criando
o meu e "useEffect",
-
que é o efeito colateral.
-
É uma função que eu estou
recebendo uma variável "seleElemento"
-
e aqui esse "seleElemento"
está recebendo
-
o que o meu "useRef" guardou.
-
Então é como se esse "useRef"
pegasse o valor,
-
guardasse e depois passasse
para o "useEffect" novamente.
-
"Current" é o atual.
-
então, é o que você estiver
selecionando atualmente
-
eu vou já mostrar aqui na tela.
-
E aqui é uma condicional
-
dizendo que ao escolher
uma das opções,
-
ele deixa marcado, selecionado.
-
E no nosso "return",
exatamente como essa aqui na tela,
-
um "select" com três opções,
HTML, CSS e JavaScript.
-
Vamos ver então o useEffect
e o useRef agindo.
-
Por exemplo, está HTML,
ao escolher CSS
-
ficou o CSS
está selecionado CSS.
-
Ao escolher o JavaScript
ficou o JavaScript.
-
HTML,
HTML.
-
É isso que useEffect faz
como colateral
-
com a ajuda do useRef que guarda
na memória o valor selecionado.
-
E assim temos o uso do e usa effect
como efeito colateral.
-
Ao selecionar uma opção
com ajuda de um outro look
-
que é o uso RF que vai memorizar
o que foi selecionado.
