-1

I'm building a React app using Redux for state management. I have set up the Redux store and Provider in my index.js file:

// index.js

import { Provider } from 'react-redux';
import store from './store';

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>  
);

In my App component, I try to access the store using the useSelector hook from react-redux:

// App.jsx

import { useSelector } from 'react-redux';

function App() {

  const state = useSelector(state => state); // throws error

  // ...
}

However, this throws the following error:

Error: Could not find react-redux context value; please ensure the component is wrapped in a <Provider>

I have confirmed:

  • The store is created and exported properly in store.js
  • App is the root component being passed to Provider
  • I'm importing useSelector from 'react-redux'

But I'm still seeing this context not found error. What am I missing in the Provider setup to make the Redux store available to components using hooks like useSelector?

Any help is appreciated!

Minesweeper
  • 69
  • 6
  • Does this answer your question? [useDispatch() Error: Could not find react-redux context value; please ensure the component is wrapped in a ](https://stackoverflow.com/questions/60329421/usedispatch-error-could-not-find-react-redux-context-value-please-ensure-the) – Mihai T Jul 16 '23 at 11:59
  • I see no overt issue with the specific code snippets you've shared. Can you [edit] to provide a more complete [mcve] enough a reader here could reasonably reproduce the issue you have? Could you also try creating a ***running*** [codesandbox](https://codesandbox.io/) demo that reproduces the issue we could inspect live? – Drew Reese Jul 17 '23 at 05:53

1 Answers1

1

Try passing context = {null} in provider wrapper as follow

<Provider store={store} context = {null}>
<App />


 </Provider>
Daud Khan
  • 82
  • 4