Reputation: 159
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
Upvotes: 15
Views: 52304
Reputation: 1
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
Upvotes: 0
Reputation: 11
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
Upvotes: 1
Reputation: 11
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.
Upvotes: 0
Reputation: 2374
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 }) {
Upvotes: 0
Reputation: 476
while you running script npm i redux
, check your package.json
is same in the same folder
Upvotes: 1
Reputation: 647
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.
Upvotes: 13
Reputation: 11
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
Upvotes: 1
Reputation: 178
Mine was a simple mistake from the import. React was capitalized.
// import { useMemo } from "React";
import { useMemo } from "react";
Upvotes: 0
Reputation: 174
Following steps fixed the issue for me
Snippet from package.json file:
"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-redux": "^8.0.1",
Upvotes: 15