re: Why the React community is missing the point about Web Components VIEW POST


Caleb, if you want save and reload for React you might try using ES6 imports and HTM: HTM lets you use ES6 template literals that resemble JSX sort of. I've used it with Preact. You literally skip the build step. You do need to run a server instance in the project to run the page in the browser so that ES6 imports work in the browser. Since this works with Preact I'm assuming the same thing would work with React.

Here's a live demo of Preact using HTM running in the browser without a build step:


Can't believe I'm just now seeing this, but it is what it is. In case any one else stumbles on this conversation, what I'm talking about is native custom event binding. In React, you pass down handlers through props: <my-el onClick={whatever}></my-el>, but that requires React's synthetic event system to know what your event name is (which it can't the way it's currently architected).

In Angular and Vue you can bind using the (event-name)="callback" or v-on:event-name="callback" syntax. LitHTML or LitElement use the @event-name="${callback}" syntax. There's currently no way to declaratively process non-native events using React/JSX and that's what I need.

code of conduct - report abuse