How to refer to a context that does not have a name?

Question

React

Trying to study the topic of hooks, I ran into a misunderstanding. When I used hoc, I declared the context like this:

const {
    Provider: CompaniesStoreServiceProvider,
    Consumer: CompaniesStoreServiceConsumer
      } = React.createContext();

And in all the examples with hooks, I see that the context is declared as const myContext = React.createContext();

and then it is accessed useContext('myContext');

Can I, without changing my way of creating a context, access it through the useContext hook?

Answer 1

No.
In useContext() , you need to pass a reference to the context object that you did not save. In js, undeclared objects cannot be accessed. Moreover, as soon as the object reference is not used, the object itself is removed by the garbage collector.

const MyContext = React.createContext();

const {
    Provider: CompaniesStoreServiceProvider,
    Consumer: CompaniesStoreServiceConsumer
} = MyContext;

useContext(MyContext);

Alternatively, you can make a helper/decorator that will create a context and return an object containing a reference to the context, the provider, and the consumer; destructure it already.

Answer 2

Export the variables CompaniesStoreServiceProvider, CompaniesStoreServiceConsumer. You wrap the application in a Provider, then wrap it in a Consumer wherever you need to and get the data from the props