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 ...
  • 10mil
9 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 ...
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 ...
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 ...
  • 3.846
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([{}]); // ...
  • 35,7mil
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 ...
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 ...
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 ...
5 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 ...
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('...
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> ...
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<...
  • 6.571
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 ...
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() { ...
  • 36,5mil
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); ...
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 > ...
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 ...
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 ...
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 ...
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 ...
  • 35,7mil
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 ...
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])...
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 ...
  • 36,5mil
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 ...
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 ...
  • 35,7mil
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-...
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 ...
  • 35,7mil
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: ...
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 ...
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 ...
  • 36,5mil

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