Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

react-redux useSelector is telling "Uncaught TypeError: Object(...) is not a function"

I am quite new in React hooks, I am trying to replace the connect, mapStateToProps and so forth with useSelector, useDispatch. This is what I have:

import React from 'react';
import { useSelector } from 'react-redux';

function MyComponent(props) {
   const data = useSelector(state => state.app.loadingData);

   return (
      <div>
        {data}
      </div>
   );
}

Which, according to https://react-redux.js.org/api/hooks is well written. This is my Redux DevTools console:

enter image description here

So, app exists in the redux state tree and loadingData exists as well. Regardless of that, my browsers console points to const data = useSelector(state => state.app.loadingData); yelling me that there is this error:

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

So, what am I doing wrong or what am I missing here?

like image 889
assembler Avatar asked Mar 30 '20 18:03

assembler


2 Answers

i had the same error and i figured out that i had miss-imported "useSelector". I was imported it from react instead of redux. :)

The mistake :

import React, { useState, useEffect, useSelector } from "react";

The good way :

import { useDispatch, useSelector } from "react-redux";
like image 171
Lacouleur Avatar answered Nov 10 '22 22:11

Lacouleur


Check your react-redux version, the userSelector function its available from versions great then 7.1.0, for to update to the last version run:

yarn add react-redux
like image 35
Daniel Lessa Avatar answered Nov 10 '22 23:11

Daniel Lessa