GithubHelp home page GithubHelp logo

Comments (10)

valotas avatar valotas commented on May 27, 2024 1

@marvinhagemeister @developit any ideas on this? Do you plan to support this for X?

from preact-context.

valotas avatar valotas commented on May 27, 2024

Hi @romansh, do you have an example of what you are describing? I never heard of it before

from preact-context.

romansh avatar romansh commented on May 27, 2024

Hi @valotas, there is an example in official docs of new react's context https://reactjs.org/docs/context.html#classcontexttype

We're using it in this way:

componentWillMount() {
        let wsUrl = window.wsUrl ? window.wsUrl : this.context.wsUrl;
        this.setState({wampPrefix: this.context.wampPrefix});
        this.setState({wsUrl: wsUrl});
    }

window.wsUrl is a variable from 'external' JS telling us an URL of our production websockets servers. If it's empty we use the test one from context. We can't use windows.variables inside render() because at time of building (with help of webpack/browserify etc) window object doesn't exists. So we have to work with it at another stage of lifecycle and use it in componentWillMount and then to use context to pass it in nested components.

Hope I have explained our reason to use this.context.

from preact-context.

valotas avatar valotas commented on May 27, 2024

@romansh sorry for my late answer. Unfortunately this is not implemented. I can not think of an easy way implementing this without monkey patching preact's context.

from preact-context.

valotas avatar valotas commented on May 27, 2024

@romansh I'm afraid you have to wrap your component with a <Consumer /> for the moment :/

from preact-context.

marvinhagemeister avatar marvinhagemeister commented on May 27, 2024

We have added support for contextType in Preact X. Personally I'm not a fan of it because it ties the default value to the module resolution. As soon as a circular dependency emerges, The consumer will be called with different default values depending on where it's used. The same is true for React.

from preact-context.

romansh avatar romansh commented on May 27, 2024

@marvinhagemeister, oh, that's great news, but where can I read about ways to use contextType in Preact X? We could not run the above react code using preact 8.4.2.

On https://preactjs.com/guide/differences-to-react I still can see "Contexts: Support for the legacy context API was added in Preact 3.0.
Support for the new api is discussed as PR #963." There are not any news in PR #963

from preact-context.

marvinhagemeister avatar marvinhagemeister commented on May 27, 2024

@romansh Preact X is not yet released and lives in a separate private repo. It mainly started out as a random experiment and wasn't intended to be the successor to the v8 release line. We recently announced March 4th as the date where we'll merge the repo into the public one: https://www.youtube.com/watch?v=DFF9eOlTWzY

contextType will be used the same way as it is in react.

from preact-context.

romansh avatar romansh commented on May 27, 2024

@marvinhagemeister, thank you for explanation. So we'll be waiting for the time when we can see the new Preact X. There is not much time left.

from preact-context.

valotas avatar valotas commented on May 27, 2024

I do not think that it makes sense to implement contextType as part of preact-context then.

from preact-context.

Related Issues (17)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.