Não é possível usar useRef como substituição de componentDidUpdate

Question

Erro

TypeError não capturado: Object (...) não é uma função

import { useSelector, useDispatch, useRef } from 'react-redux'

const mounted = useRef();

    useEffect(() => {
        console.log('mounted', mounted)
        console.log('useEffect props:', props)

Eu tenho um componente funcional e estou tentando aproveitar os ganchos para usar o componentDidUpdate, na minha função onSubmit eu disparo um envio para chamar e API, e eu preciso ver qual é a carga útil resultante dessa API, que é armazenada em redux. Mas eu recebo o erro acima?

Encontrei esta resposta que dizia para usar useRef equivalente a componentDidUpdate usando ganchos React

Answer 1

Você deve acessar seu ref usando mounted.current. Como você não está inicializando um valor, ele retornará undefined.

Se você estiver atribuindo seu ref a um elemento JSX, você não poderá acessá-lo até que o DOM seja carregado. Nesse caso, sugiro usar o useLayoutEffectgancho, já que ele não será executado até que o DOM seja carregado.

Answer 2

useRef é um gancho React. Mudar para:

import React, { useRef } from 'react';
import { useSelector, useDispatch } from 'react-redux';