diff --git a/src/components/hello-world.js b/src/components/hello-world.js
index a11d43b..8501468 100644
--- a/src/components/hello-world.js
+++ b/src/components/hello-world.js
@@ -1,11 +1,11 @@
class HelloWorld extends HTMLElement {
- static observedAttributes = ["name"];
+ static get observedAttributes() {
+ return ["name"];
+ }
connectedCallback() {
- console.log(`Greeting for ${this.name} initialized`);
let count = 0;
this.onclick = () => {
- console.log("Clicked!");
this.setAttribute("name", `Clicked ${++count}x`);
};
this.setAttribute("title", "Click me please");
@@ -13,7 +13,12 @@ class HelloWorld extends HTMLElement {
attributeChangedCallback(property, previousValue, currentValue) {
if (previousValue !== currentValue) {
- this.innerHTML = ``;
+ this[property] = currentValue;
+ this.render();
}
}
+
+ render() {
+ this.innerHTML = ``;
+ }
}
diff --git a/src/components/my-hello-world.js b/src/components/my-hello-world.js
index 1260729..dc2ab43 100644
--- a/src/components/my-hello-world.js
+++ b/src/components/my-hello-world.js
@@ -2,19 +2,13 @@ class HelloWorld extends WebComponent {
static properties = ["name"];
onInit() {
- console.log(`Greeting for ${this.name} initialized`);
let count = 0;
this.onclick = () => {
- console.log("Clicked!");
this.setAttribute("name", `Clicked ${++count}x`);
};
this.setAttribute("title", "Click me please");
}
- onChanges(changes) {
- console.log(changes);
- }
-
get template() {
return ``;
}