Hooks

Question 1

Hook useRef()

Answer 1

define como controlar um nó do DOM através da referencia, para setar o foco por exemplo.

1 - const nomeInputRef = useRef("");
2 - <input ref={nomeInputRef} />
3 - nomeInputRef.current.focus()/

Question 2

hook useEffect()

Answer 2

Utilizado para garantir que a redenrização da pagina irá acontecer sem efeitos colaterais, como também para monitorar as variáveis de estados, sempre que elas foram alteradas o trecho de código será executado como também a pagina será redenrizada com a atualização do estado.

useEffect(()=>{
  //faz algo aqui

},[variavelEstado, variavelEstado2 ]);

Question 3

useCallback

Answer 3

estudar

Question 4

useState

Answer 4

server para gerenciar o estado da aplicação, como também informar ao react que algo foi alterado e deve ser re-redenrizado pois com o uso de simples variavel não acontece;

let [nome, setNome] = useState("Tim");

Question 5

userReduce()

Answer 5

is a React Hook that lets you add a reducer to your component.

pode ser entendido como tendo a mesma funcao do useState porem consegue executar uma funcao quando a variavel for alterada;

Question 6

useReduce()

Answer 6

useReducer(reducer, initialArg, init?)

Question 7

userReduce(): user reduce padrao

Answer 7

import { useReducer } from ‘react’;

function reducer(state, action) {
// …
}

function MyComponent() {
const [state, dispatch] = useReducer(reducer, { age: 42 });

Answer 8

import { useReducer } from ‘react’;

function reducer(state, action) {
// …
}

function MyComponent() {
const [state, dispatch] = useReducer(reducer, { age: 42 });

Question 9

userReduce(): parametros do useReducer(reducer, initialArg, init?)

Answer 9

````
reducer: é uma funcao que determinar como será o retorno do estado, como ele será atualizado.
deve retornar o novo valor para o estado;

initialArg: Um valor que determina um valor inicial, de onde começar a calcular;

init (optional): Uma funcao inicializadora do valor inicial, é como se fosse um pre calculo do valor inicial que fornecemos no segundo parametro( initialArg), por isso ele é opcional.

Essa funcao init() deve retornar um valor inicial;
Se essa funcao for informada, o retorno dela que será utilizada para iniciar a funcao reducer;

Se a funcao init() for passada será algo como => return init( initialArgument )).

Se a funcao init() não for passada então será algo como return initialArgument

Se somente se, em algum momento a funcao dispacth for chamda que ela será executada em cima do valor já calcudo inicialmente
~~~

Question 10

parametros do useReduce()

Question 11

userReduce(): retorno de userReducer

Answer 11

useReducer returns an array with exactly two values:

The current state=> During the first render, it’s set to init(initialArg) or initialArg (if there’s no init).

The dispatch function => that lets you update the state to a different value and trigger a re-render.

const [state, dispatch] = useReducer(reducer, 50, FuncaoInitOptional);

Question 12

userReduce(): dispatch function