4 ms·
Ofcourse you can pass properties, I'm afraid your information is wrong in both cases. A small demo https://jsfiddle.net/zu52o7bq/ https://jsfiddle.net/zu52o7bq
by ergo14 7y ago
Ofcourse you can pass properties, I'm afraid your information is wrong in both cases.
A small demo https://jsfiddle.net/zu52o7bq/ https://jsfiddle.net/zu52o7bq/.
- TomMarius 7y agoSorry but this is in no way comparable to what React Hooks, React Contexts and React component props offer, plus the non-existent component lifecycle. I even have to render it myself! Inside the component!!! Where is separation of concerns? And why do I need to register it? I just want a class/function that behaves like a component (with a lifecycle and managed rendering), no registration whatsoever. These are not React-like components - independent reusable universal blocks that can be used without any knowledge of the component other than that it uses React.
- ergo14 7y agoYou stated one can't pass props around and you have to resort to strings (this incorrect statement is posted to HN so often I'm curious where does this knowledge comes from). I just proved you wrong with this simple demo, so you waved that away and pulled out hooks argument. How is that related is beyond me (not to mentioned hooks are fresh in react world too). If you want to have a discussion at least have decency to not change subject randomly, it is annoying. BTW. You can use both hooks (via haunted project) or redux (lots of people do that) with WC's just fine. In fact I wrote code that looks almost the same in react and lit-element.
- TomMarius 7y agoI think we misunderstand each other because of terminology. You understood me as class props, but what I meant is component props: <Component prop={something} />. In React world this is different from class props because if the prop changes it also causes the component to update. React separates the component "template" (class or function) and "node" placed in the component tree, the props are updating the node contrary to WebComponents where you have a class instance directly. In WebComponents I have to catch the underlying HTMLEntity and then set the props on the class (in React we're not setting the props on the class itself, it's separated for the ability to handle updates) and then handle all updates myself instead of just passing the complex object as a prop. Hooks are an extension of that - it is a different way to pass values around, a very powerful one.
- ergo14 7y agoYes what you need to do as a workaround is a BUG in react, not a problem with WC's - and I think Dan Abramov tweeted that this will be solved eventually (I can't find the exact tweet) - In Vue, svelte, Angular or even preact you would be able to do <my-component prop={something} /> just fine, no need to mess with HTMLEntity. If this is fixed this should be transparent to you and work the same way, you should be able to mix and match both kinds of components. See here https://custom-elements-everywhere.com/ https://custom-elements-everywhere.com/ a list of popular libraries and how they handle events and props.
- TomMarius 7y agoI meant when I'm not using react
- ergo14 7y agoI have no idea what you meant by that statement.
- TomMarius 7y agoI didn't talk about React-WC cooperation, I was talking about passing props around WebComponents when using WebComponents alone - it allows you to pass only plain values, otherwise you need the underlying HTMLEntity
- ergo14 7y agoI still have no idea what you mean by that, implementation detail? I have passed props using WC's alone in a declarative way via LitElement - all other popular solutions allow that too.