Can't use useRef as componentDidUpdate replacement

user_168738 0
Viewed 947

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

react-hooks reactjs javascript
2 Answers

useRef is a React hook. Change to:

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

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.

user_100119690
Related