-4

no meu código tenho um useEffect que executa assim assim que o componente é montado, um setInterval, que a cada um segundo chama a função incrementar que atualiza o contador , porém o contador nunca vai além de 1. Gostaria de saber o que esta acontecendo por trás dos panos para isso acontecer , desde já agradeço pela atençãoinserir a descrição da imagem aqui

2
  • Isto responde à sua pergunta? Sequencia de imagens e depois reset?
    – novic
    22/04/2022 às 18:45
  • Olá, poderia colocar o seu código dentro da pergunta, de forma textual? Não é necessário remover a imagem, mas é importante ter as partes essenciais do seu código fonte no corpo da pergunta. Aprenda porque não é legal colocar imagens em perguntas Postar mensagem de erro como imagem. Um dos motivos é que se alguém quiser responder a pergunta, não pode copiar e executar o seu código. Imagens não desempenham bem nos mecanismos de busca pelo fato do conteúdo não poder ser indexado.
    – Danizavtz
    23/04/2022 às 13:00

1 Resposta 1

1

Tem alguns problemas ai no seu código.

Primeiro, esse setInterval que você ta setando no mount do seu componente no objeto window não é uma boa, você perde o controle dele. Seria muito melhor que você usasse alguma coisa assim:

const interval = setInterval(incrementar, 1000);

Segundo, quando seu código executa pela primeira vez ele vai "construir" seu interval com o valor inicial do seu state, ao invés de usar

setCount(count + 1)

você deveria utilizar

setCount(prevCount => prevCount + 1)

Isso vai fazer o contador sair do 1.

Terceiro, dê uma olhada aqui sobre cleanup do seu useEffect é uma boa quando você tiver utilizando interval você dar um clearInterval no retorno.

import { useState, useEffect } from "react";

export default function App() {
  const [count, setCount] = useState(0);

  const increment = () => {
    setCount((prevCount) => prevCount + 1);
  };

  useEffect(() => {
    const interval = setInterval(increment, 1000);
    return () => clearInterval(interval);
  }, []);

  return (
    <div className="App">
      <h1>{count}</h1>
    </div>
  );
}

1
  • Então pelo setInterval esta sendo executando quando o componente é montado, o incrementar nunca atualiza ? 25/04/2022 às 10:18

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .