1
0
mirror of https://github.com/jaandrle/deka-dom-el synced 2025-07-05 22:02:14 +02:00

💥 observedAttributes

This commit is contained in:
2024-01-05 12:43:49 +01:00
parent 6f5e13e66a
commit 2e4e6adec1
11 changed files with 105 additions and 104 deletions

View File

@ -12,26 +12,30 @@ export class CustomHTMLTestElement extends HTMLElement{
}
connectedCallback(){
if(!this.hasAttribute("pre-name")) this.setAttribute("pre-name", "default");
console.log(observedAttributes(this));
this.attachShadow({ mode: "open" }).append(
customElementRender(this, this.render)
customElementRender(this, this.render, this.attributes)
);
}
render(test){
attributes(element){
const observed= O.observedAttributes(element);
return Object.assign({ test: element.test }, observed);
}
render({ name, preName, test }){
console.log(scope.state);
scope.host(
on.connected(()=> console.log(CustomHTMLTestElement)),
on.attributeChanged(e=> console.log(e)),
on.disconnected(()=> console.log(CustomHTMLTestElement))
);
const name= O.attribute("name");
const preName= O.attribute("pre-name");
console.log({ name, test, preName});
const text= text=> el().append(
el("#text", text),
" | "
);
return el("p").append(
el("#text", name),
el("#text", preName),
text(test),
text(name),
text(preName),
el("button", { type: "button", textContent: "pre-name", onclick: ()=> preName("Ahoj") })
);
}