Implement context about preact HOT 15 CLOSED

Now generally available as of 3.2.

from preact.

@developit Hi, did you mean that context is now supported in [email protected] ?

Route with react-router-redux is still not picking up location changes if the ConnectedRouter is in an outer/parent component.

Update:
I just did a bit of digging and it seems that componentWillReceiveProps is not called when the redux state and context changes.
Maybe that's a clue?

Update2:
OK, digging a bit deeper and coming across this it seems that passing pure: false to connect fixes this issue which makes sense.

So no worries and everything is fine I guess ;)

from preact.

@sheepsteak Is there any impact on JSX/hyperscript in adding context? I'm curious whether this should be part of preact core, or a feature of preact-compat.

Is there a specific use-case you have for context that I could test against? I know things like Alt use it to have access store data from within nested components. I did notice though, that react-redux seems to allow usage via both props or context, for what it's worth.

Definitely looking for more insight on this 👍

from preact.

@developit not too sure what you mean about "any impact on JSX/hyperscript". Do you mean any breaking changes to JSX as to how it would be implemented?

I personally use contexts all the time and a lot of people I talk to about React are the same. It's especially useful when you're doing server rendering and Flux because you then have a way to define the lifetime of your stores that is the same as the client. That's one use case.

I've also used it when building component libraries. Imagine you have some components that can change style/colour (some sort of multi-tenancy). A nice way of handling this is passing something down on the context like {style: 'green'} that the components in the library pick up on and then apply the necessary styles (bringing in relevant classes through CSS Modules).

I fully agree that anything context can do props can also do. But in large applications it becomes so tedious passing everything as props (at least when I did it last).

If you're not necessarily wanting it in core, maybe it could be a separate module somehow? I guess preact will need some substantial changes to allow modifications to the lifecycle though? Regardless, I think it has to be in preact-compat somehow as it's a valid part of React that people will use.

from preact.

It seems like this is going to need to be in core, if only because it touches on so many parts of the lifecycle as you said. I've also run into a few things that would benefit from it (universal rendering and nested routers in preact-router).

I should have time this week to get contexts added, will be looking for help with real-world tests though.

from preact.

+ I will probably take this as a chance to address #3 as well, that will help with clutter.

from preact.

👍 I can help with some tests.

from preact.

Context in React is a good concept of explicit "stream" of data flowing down the tree and it serves a specific purpose.

If a component needs something, it explicitly asks for it (by contextTypes) so it's not automagically injected in to each component. It's useful for things like <Link> elements that can deal with routing and need acess not only to store but also to history object. Both of these objects are per-app.

from preact.

@antitoxic Agreed regarding <Link> and similar use-cases (including nested <Router>s). I'm hoping to have 3.0 out this weekend, which adds full support for context.

from preact.

Cool! In that case, sorry that i brought you a ~useless github notification 😄

from preact.

No problem, it was a good reminder that I will need to add context support to preact-router's <Link/> component as part of the update.

from preact.

Context is the main hook for redux-router to hook into it actually. Since it's one of the more widely used abstraction layers currently.

https://github.com/rackt/react-redux/blob/master/src/components/Provider.js

from preact.

I just published a prerelease of 3.0 which supports dangerouslySetInnerHTML. On npm as preact-3.0.0-beta1. Please test out contexts for your use-cases and let me know what you think.

from preact.

@developit: Does this context api support the getChildContext method on components?

from preact.

@shiftyp Yup! Let me know if you're able to test against the beta, I would love your feedback! npm install preact@beta

from preact.