Impossible d'utiliser useRef comme remplacement de componentDidUpdate

Question

Erreur

Uncaught TypeError: Object (...) n'est pas une fonction

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

const mounted = useRef();

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

J'ai un composant fonctionnel et j'essaie de tirer parti des hooks pour utiliser componentDidUpdate, dans ma fonction onSubmit, je déclenche une répartition pour appeler et API, et j'ai besoin de voir quelle est la charge utile résultante de cette API, qui est stockée dans redux. Mais j'obtiens l'erreur ci-dessus?

J'ai trouvé cette réponse qui disait d'utiliser useRef Equivalent à componentDidUpdate en utilisant des hooks React

Answer 1

Vous devez accéder à votre référence en utilisant mounted.current. Puisque vous ne l'initialisez pas une valeur, il retournera undefined.

Si vous affectez votre référence à un élément JSX, vous ne pourrez pas y accéder tant que le DOM ne sera pas chargé. Dans ce cas, je suggérerais d'utiliser le useLayoutEffecthook, car il ne fonctionnera pas tant que le DOM ne sera pas chargé.

Answer 2

useRef est un hook React. Changer pour:

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