Moved properties over to a object model and added a resetProperties function that will reset properties to their default values. Fixed a few bugs and cleaned up the code a little more.
This commit is contained in:
26
src/sheet.js
26
src/sheet.js
@ -1,23 +1,18 @@
|
||||
import { IgniteElement } from './ignite-element.js';
|
||||
import { IgniteTemplate, div, html, list, a } from './ignite-template.js';
|
||||
import { IgniteTemplate, div, html, list, a, slot } from './ignite-template.js';
|
||||
|
||||
class Sheet extends IgniteElement {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
this.show = false;
|
||||
this.items = [];
|
||||
this.href = "www.google.com";
|
||||
this.name = "default content";
|
||||
}
|
||||
|
||||
get properties() {
|
||||
return [
|
||||
"show",
|
||||
"name",
|
||||
"items",
|
||||
"href"
|
||||
];
|
||||
return {
|
||||
show: false,
|
||||
items: ["1", "2"],
|
||||
href: "www.google.com",
|
||||
name: "default content"
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -27,9 +22,12 @@ class Sheet extends IgniteElement {
|
||||
new div(
|
||||
new html("<h2>this is before</h2>"),
|
||||
new list(this.items, (item) => {
|
||||
return new a(this.name).attribute("href", this.href)
|
||||
return new a(new html(`<h3>${item}</h3>`)).attribute("href", this.href)
|
||||
}),
|
||||
new html("<h2>this is after</h2>")
|
||||
new html("<h2>this is after</h2>"),
|
||||
new html("<h3>---- begin sheet's slot ----<h3>"),
|
||||
new slot(this),
|
||||
new html("<h3>---- end of slot ----</h3>")
|
||||
)
|
||||
);
|
||||
}
|
||||
|
Reference in New Issue
Block a user