[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:07.78,0:00:11.08,Default,,0000,0000,0000,,O useEffect é um tipo de hook\Nmuito versátil.
Dialogue: 0,0:00:11.08,0:00:13.75,Default,,0000,0000,0000,,Uma de suas funções\Né o efeito colateral.
Dialogue: 0,0:00:13.75,0:00:15.15,Default,,0000,0000,0000,,Vamos ver como funciona?
Dialogue: 0,0:00:15.15,0:00:19.95,Default,,0000,0000,0000,,No projeto temos\Na seguinte estrutura,
Dialogue: 0,0:00:19.95,0:00:22.92,Default,,0000,0000,0000,,na pasta "components",\N"Exemplo2".
Dialogue: 0,0:00:22.92,0:00:26.16,Default,,0000,0000,0000,,Nosso componente "Exemplo2"\Ncom a primeira letra maiúscula,
Dialogue: 0,0:00:26.16,0:00:29.46,Default,,0000,0000,0000,,".jsx" a sua extensão.
Dialogue: 0,0:00:29.46,0:00:31.80,Default,,0000,0000,0000,,Temos a seguinte estrutura,
Dialogue: 0,0:00:31.80,0:00:34.99,Default,,0000,0000,0000,,estamos importando um hook\Nchamado "useRef"
Dialogue: 0,0:00:34.99,0:00:37.63,Default,,0000,0000,0000,,que, na verdade, \Nele ajuda o useEffect
Dialogue: 0,0:00:37.63,0:00:42.94,Default,,0000,0000,0000,,a memorizar o que ele vai fazer\Ncomo colateral.
Dialogue: 0,0:00:42.94,0:00:46.79,Default,,0000,0000,0000,,Nesse exemplo,\Nnós temos aqui uma função,
Dialogue: 0,0:00:46.79,0:00:52.35,Default,,0000,0000,0000,,que está recebendo uma constante\N"selecionarRef".
Dialogue: 0,0:00:52.35,0:00:57.86,Default,,0000,0000,0000,,Então aqui, é uma variável selecionar \Ne estou passando "useRef" vazio.
Dialogue: 0,0:00:57.86,0:01:00.80,Default,,0000,0000,0000,,Embaixo, eu estou criando\No meu "useEffect",
Dialogue: 0,0:01:00.80,0:01:02.83,Default,,0000,0000,0000,,que é o efeito colateral.
Dialogue: 0,0:01:02.83,0:01:13.06,Default,,0000,0000,0000,,É uma função que estou\Nrecebendo uma variável "seleElemento"
Dialogue: 0,0:01:13.06,0:01:16.44,Default,,0000,0000,0000,,e aqui, esse "seleElemento",\Nestá recebendo
Dialogue: 0,0:01:16.44,0:01:18.68,Default,,0000,0000,0000,,o que o meu "useRef" guardou.
Dialogue: 0,0:01:18.68,0:01:22.55,Default,,0000,0000,0000,,Então é como se esse "useRef"\Npegasse o valor,
Dialogue: 0,0:01:22.55,0:01:26.55,Default,,0000,0000,0000,,guardasse e depois passasse\Npara o "useEffect" novamente.
Dialogue: 0,0:01:26.55,0:01:27.89,Default,,0000,0000,0000,,"Current" é o atual.
Dialogue: 0,0:01:27.89,0:01:30.100,Default,,0000,0000,0000,,Então, é o que você estiver\Nselecionando atualmente.
Dialogue: 0,0:01:30.100,0:01:33.29,Default,,0000,0000,0000,,E eu vou já mostrar aqui na tela.
Dialogue: 0,0:01:33.29,0:01:36.36,Default,,0000,0000,0000,,E aqui, é uma condicional
Dialogue: 0,0:01:36.36,0:01:39.25,Default,,0000,0000,0000,,dizendo que ao escolher\Numa das opções,
Dialogue: 0,0:01:39.25,0:01:42.98,Default,,0000,0000,0000,,ele deixa marcado, \Nselecionado.
Dialogue: 0,0:01:42.98,0:01:47.84,Default,,0000,0000,0000,,E no nosso "return",\Nexatamente como está aqui na tela,
Dialogue: 0,0:01:47.84,0:01:53.85,Default,,0000,0000,0000,,um "select" com três opções,\NHTML, CSS e JavaScript.
Dialogue: 0,0:01:53.85,0:01:59.02,Default,,0000,0000,0000,,Vamos ver então o useEffect\Ne o useRef agindo.
Dialogue: 0,0:01:59.02,0:02:02.79,Default,,0000,0000,0000,,Por exemplo, está HTML,\Nao escolher CSS,
Dialogue: 0,0:02:02.79,0:02:05.99,Default,,0000,0000,0000,,ficou o CSS,\Nestá selecionado o CSS.
Dialogue: 0,0:02:05.99,0:02:09.83,Default,,0000,0000,0000,,Ao escolher o JavaScript,\Nficou o JavaScript.
Dialogue: 0,0:02:09.83,0:02:11.80,Default,,0000,0000,0000,,HTML, HTML.
Dialogue: 0,0:02:11.80,0:02:16.52,Default,,0000,0000,0000,,É isso que o useEffect faz\Ncomo colateral
Dialogue: 0,0:02:16.52,0:02:22.41,Default,,0000,0000,0000,,com a ajuda do useRef que guarda\Nna memória o valor selecionado.
Dialogue: 0,0:02:22.41,0:02:26.35,Default,,0000,0000,0000,,E assim temos o uso do useEffect\Ncomo efeito colateral
Dialogue: 0,0:02:26.35,0:02:31.05,Default,,0000,0000,0000,,ao selecionar uma opção\Ncom a ajuda de um outro hook
Dialogue: 0,0:02:31.05,0:02:32.34,Default,,0000,0000,0000,,que é o useRef,
Dialogue: 0,0:02:32.34,0:02:34.83,Default,,0000,0000,0000,,que vai memorizar\No que foi selecionado.