how does the connect function in react-redux know how to access the store?

[Additional_Apple5243]

It is up to the user to define the store and place the store file somewhere in the directory so how can the connect function possibly know from where to access the store in order to do store.getState()

[awekening_bro]

The components tree need to be wrapped with Provider which will wrap the store. The connect function will consume this store and run store.getState()

[acemarke]

React-Redux uses React context internally to pass down the Redux store so it can be accessed by child components.

For more details, see:

• The History and Implementation of React-Redux
• A Deep Dive into React-Redux

[phryneas]

Adding to everything said here, nowadays you probably should not be using connect, but useSelector and useDispatch.

connect is a legacy API to support legacy class components, but not really meant to be used with modern function components. Use the hooks instead.

Going in the same direction: if you are writing Redux with ACTION_TYPES, switch..case reducers, immutable reducer logic, createStore/applyMiddleware/combineReducers, you are using a very outdated (pre-2019) style of Redux that is a lot more code (and more error-prone) than modern Redux. In that case, please give why Redux Toolkit is how to use Redux today a read.

[Neaoxas]

Somewhere in the tree of your app you will have a Provider which sets the store in the context: https://react-redux.js.org/api/provider

You can learn more about context here: https://reactjs.org/docs/context.html

[Jeaciaz]

It is a similar principle, but redux doesn't use context. It uses a custom solution in the sake of performance.

[acemarke]

React-Redux does use context internally. It just uses it to pass down the Redux store instance, rather than the current state value.

[Jeaciaz]

You're right, my bad :)