Respostas interessantes marcadas com a tag

10 votos
Aceito

O que são React Hooks?

Existem 4 tipos de Hooks: State Hook Effect Hook Custom Hook Other Hook (Hooks nativos com funções específicas) Resumindo: "When would I use a Hook? If you write a function component and realize ...
Costamilam's user avatar
  • 10mil
10 votos

Qual é a diferença entre os hooks useMemo e useCallback do React?

A diferenças das duas é que a useCallback não é executada no render enquanto a useMemoé. Isso cria a possibilidade de "guardar" a função para ser utilizada apenas por callbacks por exemplo, como o ...
Gabriel Santos's user avatar
9 votos
Aceito

React Hook useEffect has a missing dependency: .... Either include it or remove the dependency array react-hooks/exhaustive-deps

O problema aqui, é que não fica claro usar métodos externos dentro do evento do useEffect, pois será mais complicado de mapear o que efeito precisa de informações para ser executado. Todas variáveis ...
Eric Roberto's user avatar
7 votos
Aceito

Como posso mudar somente uma propriedade de um objeto usando o hook useState

Você pode utilizar o spread operator na hora de atualizar o valor no State. Ficaria da seguinte forma: setValue(prevState => { return { ...prevState, value1: "novo valor" } }); Desta forma, o ...
Bins's user avatar
  • 3.842
7 votos
Aceito

Como colocar objetos em array vazio com React Hooks

O problema é que você inicializa data como um array que já está com o primeiro elemento preenchido. No caso, por um objeto literal "vazio": const [data, setData] = useState([{}]); // ...
Luiz Felipe's user avatar
  • 36,1mil
6 votos

O que são React Hooks?

O que são Hooks? Hooks são um conjunto de novas funcionalidades que dentre outras coisa permitem ao desenvolvedor controlar o state de uma forma mais simples, mais rápida e mais intuitiva. Sua ...
Bognar Junior's user avatar
6 votos
Aceito

Os "Class Components" morreram no React?

TLDR: As classes não vão morrer. (ao menos, não tão cedo). Como já foi respondido aqui, a documentação cita que não há planos para remover classes do React. Porém a documentação traz diversos outros ...
Rafael Tavares's user avatar
6 votos
Aceito

Qual é a diferença entre os hooks useMemo e useCallback do React?

A única coisa que ambos os hooks possuem em comum é de que retornam algo memoizado. Apesar disso ser o suficiente para confundir a funcionalidade de ambos, ao longo da resposta ficará bem claro quais ...
Rafael Tavares's user avatar
6 votos
Aceito

State retornando valor errado / atrasado

O setState é assíncrono Esse é o comportamento esperado. Chamadas ao setState são assíncronas, o React busca realizar uma atualização em lote (batch) para causar menos renderizações. Tendo em vista ...
Rafael Tavares's user avatar
3 votos

Qual é a diferença entre os hooks useMemo e useCallback do React?

Uma boa forma de entender a diferença entre useMemo e useCallback é ver que é possível reproduzir o useCallback utilizando um useMemo. Exemplo: const useCallback = useCallback(() => console.log('...
Elton Carreiro's user avatar
3 votos
Aceito

Como alternar o estado de apenas um item no FlatList?

Consegui resolver, é só criar um componente separado e chamar esse componente no rendeItem do flatlist passando as props FlatList: const Sounds: React.FC = () => { return ( <Container> ...
Nycollas's user avatar
3 votos
Aceito

Problema ao tipar primeiro parametro do setState do React

Isso acontece porque o setState é muito mais do que uma simples função que retorna somente um booleano. Nas variáveis do useState, o segundo elemento (mudarExecucao) é uma função do tipo Dispatch<...
Cmte Cardeal's user avatar
  • 6.640
3 votos
Aceito

Como usar o hook do React useRef com o componente NumberFormat?

De acordo com a documentação do próprio componente, como ref é uma propriedade especial do React, você está pegando a referência do componente NumberFormat, e não do input. Para pegar a referência do ...
Rafael Tavares's user avatar
3 votos
Aceito

Como adicionar novo objeto em posição especifica de array useState Hooks

Utilizando map para interar em cada item do seu array e o filtro que vai trazer os dados filtrados do outro array pode montar a estrutura como demonstrado na pergunta, exemplo: function App() { ...
novic's user avatar
  • 36,6mil
3 votos
Aceito

React Hook useEffect has a missing dependency: 'storeInfo'

const [storeInfo, setStoreInfo] = useState(null); useEffect(()=>{ const loadAll = async () => { let chosenInfo = await Tmdb.getStoreById(635302); setStoreInfo(chosenInfo); ...
Peter Adam's user avatar
3 votos

Error: Too many re-renders. React limits the number of renders to prevent an infinite loop

Acredito que seu problema esteja nesse trecho do componente CardAnime. if(anime){ setGeneros(anime.genero.split(",")); if (generos.length > 3) { while (generos.length > ...
Gabriel José de Oliveira's user avatar
3 votos
Aceito

Como otimizar a renderização em componentes funcionais no React?

Otimizar a performance do app é um assunto muito extenso. O título da pergunta diz respeito a otimizar a renderização, e isso pode ser levado para duas interpretações: evitar uma renderização ...
Rafael Tavares's user avatar
3 votos
Aceito

Como usar componentDidMount, componentWillUnmount e declarar o estado inicial em componentes funcionais?

Hooks Você substituirá as funções de ciclo de vida por hooks. O estado também. Por isso, leia O que são React Hooks? caso tenha alguma dúvida sobre eles de maneira geral. useEffect O hook useEffect ...
Rafael Tavares's user avatar
3 votos
Aceito

Loop de Requisições no useEffect

Seu problema esta na lista de dependências do seu useEffect, veja que você passa lista no array de dependências, e internamente você atualiza esse estado após a requisição ser completa, fazendo isso ...
Gabriel José de Oliveira's user avatar
3 votos
Aceito

Como sobrescrever o type "string" do localstorage para um outro type com typescript?

Lembre-se que o TypeScript não consegue garantir, só a partir de uma definição de tipos, que um valor de fato terá aquele tipo. Voltemo-nos ao seu tipo Themes: type Themes = 'light' | 'dark'; Veja ...
Luiz Felipe's user avatar
  • 36,1mil
2 votos
Aceito

React Native: O componente não encontra dados de um state após um setState

Não entendi muito bem, mas pq vc joga isso em um array se é um unico objeto ? Se forem diversos objetos em um array, não tem como pegar usando user.name Se for um unico objeto retornando,vc nao ...
Jonathan Souza's user avatar
2 votos

UseDispatch() dentro de um useEffect() -> *missing dependency*

O alerta é dado pois a função dispatch não está no array de dependência do useEffect. Para solucionar precisa deixar desta forma useEffect(() => { dispatch(ACTION.CARREGAR()) }, [dispatch])...
Vicenzo Martinelli's user avatar
2 votos
Aceito

Duvida sobre padrão classe React

Minha duvida é, porque o React não cria a estrutura padrão como abaixo? Deve estar usando a versão mais recente do reactjs(Versão: >=16.8) que apresenta os Hooks. A grande motivação para essa ...
novic's user avatar
  • 36,6mil
2 votos

O que são React Hooks?

O que são hooks? Hooks são funções, por isso variam tanto entre si. Alguns retornam um objeto, outros retornam um array, uma função ou nada. Cada hook terá sua responsabilidade, inclusive você pode ...
Rafael Tavares's user avatar
2 votos
Aceito

Como usar "shouldComponentUpdate" com Hooks?

Nesses casos, você pode utilizar a API React.memo, uma higher order function. Da documentação: Se seu function component renderiza o mesmo resultado dados os mesmos props, você pode envolver nele uma ...
Luiz Felipe's user avatar
  • 36,1mil
2 votos

Refresh de Token JWT

Olá sugiro fazer uma PrivateRoute, assim a cada rota chamada no routes passaria por essa PrivateRoute e la dentro tu chamaria um metodo para renovar o token. import { Route, Redirect } from "react-...
Bruno Santi's user avatar
2 votos
Aceito

Ajuda com API/useEffect - React

O estado está sendo provavelmente alterado sim. O problema é que você está executando o console.log antes dele ser alterado. O processo de alteração de estado no React é assíncrono. Além disso, como ...
Luiz Felipe's user avatar
  • 36,1mil
2 votos
Aceito

Erro no useEffect ao acessar dados da API

Baixei o seu projeto e tentei debuggar esse problema. Como não tenho acesso ao banco, o app não starta e meu diagnóstico pode não estar 100% correto, mas aqui temos as seguintes possíveis causas: ...
Rodrigo Amaral's user avatar
2 votos
Aceito

React Native useState criar input com loop

Nesse caso eu usaria o useState para armazenar um objeto com os valores dos inputs, e outro para armazenar o objeto de ItensMenu. Fiz um código de exemplo, fiz uma mistura de inglês com portugês, mas ...
Daniel Magalhaes's user avatar
2 votos
Aceito

useState não funciona como o esperado

As atualizações dos estados dos componentes não é tão simples como parece, são assíncrono, em resumo demora um tempo para acontecer e as variáveis com os novos estados precisam ser vigiadas para tomar ...
novic's user avatar
  • 36,6mil

Only top scored, non community-wiki answers of a minimum length are eligible