2

Error

Uncaught TypeError: Object(...) is not a function

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

const mounted = useRef();

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

I have a functional component and trying to take advantage of hooks to use componentDidUpdate, in my onSubmit function I fire a dispatch to call and API, and I need to see what is the resulting payload of that API, which is stored in redux. But I get the error above?

I found this answer which said to use useRef Equivalent to componentDidUpdate using React hooks

Leon Gaban
  • 36,509
  • 115
  • 332
  • 529

2 Answers2

3

useRef is a React hook. Change to:

import React, { useRef } from 'react';
import { useSelector, useDispatch } from 'react-redux';
Or Assayag
  • 5,662
  • 13
  • 57
  • 93
2

You should access your ref using mounted.current. Since you are not initializing it a value, it will return undefined.

If you are assigning your ref to a JSX element, you will not be able to access it until the DOM has loaded. In that case, I would suggest using the useLayoutEffect hook, since it will not run until the DOM has loaded.

Glen Carpenter
  • 392
  • 2
  • 9