Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

207
Visualizações
React causing: Can't perform a React state update on an unmounted component

My situation: After login I try to get username and save it to redux store after this redirect from login to home page(in this page I display list of tasks) and I'm getting: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application.

I try ususal isMounted trick but its not help.

Login.js

function getUsername(){
    let username = ""
    const headers = {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
    };

    try {
        axios.get(`${process.env.REACT_APP_API_URL}/api/get_username/`,{
                headers: headers,
            })
            .then(response => username = response.data["username"])
            .catch(error => setResponse(error.response))
    } catch (err) {
        console.log(err)
    }

    return username
}

const loginSubmit = e => {
    e.preventDefault()
    const headers = {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'X-CSRFToken': csrftoken,
    };
    const body = {username: username, password: password}
    try {
        axios.post(`${process.env.REACT_APP_API_URL}/api/login/`, body,{
                headers: headers,
            })
            .then(response => setResponse(response))
            .catch(error => setResponse(error.response))
    } catch (err) {
        console.log(err)
    }

    dispatch({type: "SET_NAME", name:getUsername()})
    Cookies.set("logged_in", "yes")

    navigate("/", {replace:true})
};

Home.js

function getTasks(isMounted){
    const headers = {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
    };
    try {
        axios.get(`${process.env.REACT_APP_API_URL}/api/tasks/`, {
            headers: headers,})
            .then(response => {if(isMounted ){setTasks(response.data)}})
            .catch(error => setTasks(error.response))
    } catch (err) {
        console.log(err)
    }
}

useEffect(() => {
    let isMounted = true;
    getTasks(isMounted);
    return () => {
        isMounted = false;
    };
}, []);
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

You can use local storage.

Set item:

localStorage.setItem("name", JSON.stringify(name))

Get Item:

localStorage.getItem("name")
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda