Added onClick and onEvent shorthand event handlers to reduce duplicate code.

This commit is contained in:
2020-08-21 22:13:06 -07:00
parent b0b9a83cc6
commit 138513ce2b
2 changed files with 70 additions and 2 deletions

View File

@ -1,5 +1,5 @@
import { IgniteElement } from './ignite-element.js';
import { IgniteTemplate, div, html, list, a, slot } from './ignite-template.js';
import { IgniteTemplate, div, html, list, a, slot, input } from './ignite-template.js';
class Sheet extends IgniteElement {
constructor() {
@ -14,7 +14,8 @@ class Sheet extends IgniteElement {
name: "default content",
color: "red",
linkClick: this.onClick1,
linkClick2: this.onClick2
linkClick2: this.onClick2,
enter: this.onEnter,
};
}
@ -32,6 +33,7 @@ class Sheet extends IgniteElement {
.class(this.show)
.child(
new div(
new input().attribute("type", "text").onEnter(this.enter),
new html("<h2>this is before</h2>"),
new list(this.items, (item) => {
return new a(new html(`<h3>${item}</h3>`)).attribute("href", this.href)
@ -54,6 +56,10 @@ class Sheet extends IgniteElement {
onClick2(event) {
console.log("Element was clicked 2!");
}
onEnter(event) {
console.log("Enter was pressed!");
}
}
class SheetTemplate extends IgniteTemplate {