wcb/demo/HelloWorld.mjs
Ayo 910a5096d0 feat: props Proxy for camelCase counterparts
- provide easy access to any observed attribute.
- update README examples
- update JSDoc examples
2023-11-17 23:10:02 +01:00

19 lines
477 B
JavaScript

// @ts-check
import WebComponent from "../src/index.js";
export class HelloWorld extends WebComponent {
static properties = ["my-name", "emotion"];
onInit() {
let count = 0;
this.onclick = () => (this.props.myName = `Clicked ${++count}`);
}
get template() {
return `<button id="btn">Hello ${this.props.myName ?? "World"}${
this.props.emotion === "sad" ? ". 😭" : "! 🙌"
}</button>`;
}
}
customElements.define("hello-world", HelloWorld);