Content: add `Component Composition > Context`

[matschik]

React: https://fr.reactjs.org/docs/hooks-reference.html#usecontext
Svelte: https://svelte.dev/tutorial/context-api
Vue 3:
SolidJS: https://www.solidjs.com/tutorial/stores_context

[stondbringa]

The equivalent for Vue 3 is Provide/Inject: https://vuejs.org/guide/components/provide-inject.html

[matschik]

React & Svelte examples are now available

[mroeling]

Hi @matschik ,

Was trying to understand the goal of these code snippets. Could you give a bit more context (no pun intended) of what is the goal of this example?
From a Aurelia point of view, since it is class based, things can be done by using Dependency Injection. Another option is using the Event system. Using aurelia-store (i.e. RxJs state management) it is also possible.

[matschik]

Explained by React docs: https://beta.reactjs.org/learn/passing-data-deeply-with-context
Explained by Svelte docs: https://svelte.dev/tutorial/context-api
Explained by Vue docs: https://vuejs.org/guide/components/provide-inject.html

Context VS Store (from Svelte link)

Contexts and Stores seem similar. They differ in that stores are available to any part of an app, while a context is only available to a component and its descendants. This can be helpful if you want to use several instances of a component without the state of one interfering with the state of the others.
In fact, you might use the two together.

Additionnally,store is planned for Component Party.

[harshilparmar]

For Angular , Is it to good to mention service in this place? Yeah there is no such concept of context but using service we can eventually achieve that behavior.