73dd374a3e
We are now able to attach "side effects" to property value changes, from inside the component and outside.
25 lines
601 B
JavaScript
25 lines
601 B
JavaScript
// @ts-check
|
|
import WebComponent from "../src/WebComponent.js";
|
|
import { attachEffect } from "../src/attach-effect.js";
|
|
|
|
export class Counter extends WebComponent {
|
|
static properties = ["count"];
|
|
onInit() {
|
|
this.props.count = 0;
|
|
this.onclick = () => ++this.props.count;
|
|
attachEffect(
|
|
this.props.count,
|
|
(count) => console.log(count)
|
|
);
|
|
}
|
|
|
|
afterViewInit(){
|
|
attachEffect(this.props.count, (count) => console.log(count + 100));
|
|
}
|
|
|
|
get template() {
|
|
return `<button id="btn">${this.props.count}</button>`;
|
|
}
|
|
}
|
|
|
|
customElements.define("my-counter", Counter);
|