TypeError: Cannot read properties of null (reading 'useMemo')
Asked Answered
M

9

13

Am getting "TypeError: Cannot read properties of null (reading 'useMemo') error Redux in my react redux application. I made a very simple react redux application. but am keep getting this error. searched about this error on Internet unfortunately didn't get any solution.

Redux folder structure:

src >> state(folder) >> store.js
reducer.js

reducer.js


const initialState={
    user:[]
}


export const userReducer=(state=initialState,action)=>{
    switch (action.type) {
        case "TEST_DATA":
                return state
        default:
            return state
    }
 
}

store.js

import {createStore,applyMiddleware} from "redux"
import {userReducer} from './reducer'
import {composeWithDevTools} from 'redux-devtools-extension'
import thunk from 'redux-thunk'


export const store=createStore(userReducer,composeWithDevTools(applyMiddleware(thunk)))

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import { Provider } from 'react-redux';
import {store} from './state/store'


ReactDOM.render(
<Provider store={store}>
  <App />
</Provider>
  ,
  document.getElementById('root')
);

Tried to access state in App.jsx component

console.log(useSelector(state=>state))

am trying to fix it from last 3-4 days. Please help me am new to react and redux. Thanks in advance

Manipulator answered 3/5, 2022 at 7:11 Comment(0)
S
15

Following steps fixed the issue for me

  1. Check your react version in package.json
  2. If the react version is 18, then update "react-redux" package using npm i react-redux
  3. the "react-redux" package should have version 8 in package.json
  4. run npm start

Snippet from package.json file:

"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-redux": "^8.0.1",
Sybille answered 5/5, 2022 at 13:36 Comment(1)
I am using react-redux 8.0.5 still facing this error.Drypoint
F
9

If anyone runs into this error with Next.js v13+ using the App directory (AKA App Router) then it could be because you're trying to use useMemo in a server component.

Foozle answered 29/7, 2023 at 13:50 Comment(0)
G
1

Simply do one thing install all these one more time and you will get free from this error. i.e npm i redux react-redux redux-thunk

Grugru answered 30/5, 2023 at 17:32 Comment(1)
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From ReviewDichasium
E
1

while you running script npm i redux , check your package.json is same in the same folder

Emmett answered 5/9, 2023 at 2:14 Comment(0)
D
1

this is because you are not in the correct folder make sure you install react-redux in the correct react folder eg:cd my-app npm i react-redux

Doelling answered 26/11, 2023 at 6:55 Comment(0)
P
0

Mine was a simple mistake from the import. React was capitalized.

// import { useMemo } from "React";
import { useMemo } from "react";
Popgun answered 30/3, 2023 at 7:25 Comment(0)
A
0

For ones who using Next.js App directory, you need 'use client' at the begining of the file and make sure that

// Wrong 
export async default function Page({ params }) {

// Correct
export default function Page({ params }) {
Abstruse answered 17/9, 2023 at 22:3 Comment(0)
D
0

This is because redux toolkit is used now and redux is deprecated. Delete node modules and reinstall using this command npm install --legacy-peer-deps.

Doelling answered 24/9, 2023 at 16:40 Comment(0)
S
0

This may be because there are multiple React instances in your project. Try to check the structure of the project's node_modules and whether React is installed separately in the React Redux directory

Sikh answered 27/8 at 6:48 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.