Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Como chamar uma função depois que o context hook do react é atualizado

Estou tentando chamar uma função depois que o "context hook" do react é atualizado. Tentei o código abaixo:

const MyComponent = () => {
  [context] = useContext(MyContext);

  function updateContext():void {
    context = "someNewContext";
  }

  function anotherFunction():void {
    console.log("success!");
  }

  useEffect(() => {
    anotherFunction();
  }, [context]);

  return (
    <button onClick={updateContext}>update</button>
  );
}

export default MyComponent;
1 resposta
solução!

Oi Felipe!

Pelo seu código, a variável context é apenas uma variável comum, mas para que o React saiba que ela é importante e sua mudança deve causar uma nova renderização, é necessário que ela seja um React.useState.

Se você ainda não conhece o useState, recomendo que você assista o curso React hooks e formularios. Neste curso também é abordado o useContext.

Lembrando do conceito do useState: não é possível mudar o valor de um state com atribuição direta. Isso só é possível com a função responsável por isso (o segundo elemento do array retornado pelo useState).

const [contador, setContador] = React.useState(0);

// errado
contador = 1 

// certo
setContador(1);

Seu componente de exemplo vai ficar mais ou menos assim:

const MyComponent = () => {
  const {context, setContext} = useContext(MyContext);

  function updateContext():void {
   setContext("someNewContext");
  }

  function anotherFunction():void {
    console.log("success!");
  }

  useEffect(() => {
    anotherFunction();
  }, [context]);

  return (
    <button onClick={updateContext}>update</button>
  );
}

export default MyComponent;

Espero ter ajudado! Qualquer outra dúvida pode postar aqui!