How to use createSelectorHook()

[binarybehemoth]

I am receiving this error on CodeSandbox: Cannot read properties of undefined (reading 'getState')

What is the proper way to use createSelectorHook()?

[phryneas]

Remove that code and you are already set up.

const Counter = (props) => {
  return (
-    <context.Provider value={props}>
      <A />
-    </context.Provider>
  );
};

But please be aware that you should do that very rarely and in almost all instances should not have multiple stores in your applciation.

Also, please note that you are writing a very outdated style of Redux here and should be using the official Redux Toolkit instead of writing switch..case reducers by hand. See Why Redux Toolkit is How To Use Redux Today

[binarybehemoth]

ok....after removing those two lines, how do I pass a context value (eg. step) down the components hierarchy?

[phryneas]

I think you might be misunderstanding what that actually does.
It allows you to use multiple Providers with multiple different Redux stores in the same application.

It does not allow you to inject any values manually anywhere.

[binarybehemoth]

I am not sure if I have understood you. Take the example here:

https://react-redux.js.org/api/hooks#custom-context

It does use a context, doesn't it? I don't see multiple Providers...

[binarybehemoth]

Could you please give me a full sandbox example to illustrate the usage?

[phryneas]

Provider always uses a context. In that context, it will pass the store down to the components.
createSelectorHook allows you to create another context to pass another store down to your components so you can have multiple stores in your applications.

Context is used here as a transport mechanism for store - which is pretty much what it is designed for: Context is a dependency injection mechanism, not a way of propagating actual state values to your components.

[markerikson]

FWIW, in normal usage you do not need to create a custom context instance for use with React-Redux.

Can you clarify what you're actually trying to accomplish overall? What are you working on that you feel needs to make use of a custom context instance here?

[binarybehemoth]

Well, actually I am developing a programming reference website and trying to explain different aspects of Redux to the public:

https://webcodingcenter.com/redux/connect

I wanted to introduce the createSelectorHook() API.

I will be elaborating on Redux Toolkit these few days.

[markerikson]

That's my point. You don't and shouldn't be "introducing the createSelectorHook API", because it's not a thing that 99.9% of our users will ever need to use. It's for an extremely rare edge case only.

Just teach useSelector and useDispatch, as shown in our docs:

• https://redux.js.org/tutorials/fundamentals/part-5-ui-react#using-redux-with-react
• https://redux.js.org/tutorials/essentials/part-2-app-structure#the-react-counter-component

[binarybehemoth]

Alright. I will ignore createSelectorHook() then.