Çözüldü Vanilla JavaScript ile component oluşturmak

Şebnem Ferah dedi:

Vue.js

Vue.js - The Progressive JavaScript Framework

vuejs.org

Başlangıç – React

Kullanıcı arayüzleri geliştirebileceğiniz bir JavaScript kütüphanesi

tr.reactjs.org

Basitinden örnek verilebilir.

Genişletmek için tıkla...

Şebnem Ferah dedi:

@533388 https://www.freecodecamp.org/
Vs bakabilirsin.

Genişletmek için tıkla...

Kxaan dedi:

Örnek saat componenti oluşturdum, bakabilirsin.

JavaScript:Panoya kopyala

class TimeDisplay extends HTMLElement {
 connectedCallback() {
 console.log("Element DOM'a eklendi.");
 this.interval = setInterval(() => {
 this.textContent = new Date().toLocaleTimeString();
 }, 1000);
 }
 disconnectedCallback() {
 console.log("Element DOM'dan çıkarıldı.");
 clearInterval(this.interval);
 }
}

customElements.define("time-display", TimeDisplay);

HTML:Panoya kopyala

<time-display></time-display>

Genişletmek için tıkla...

533388 dedi:

Merak ettigim şey htmlelement sinifidan miras almasak o ozellikleri kullanamiyor muyuz?

Genişletmek için tıkla...

Kxaan dedi:

disconnectedCallback() { console.log("Element DOM'dan çıkarıldı."); clearInterval(this.interval); } }

Genişletmek için tıkla...

class Mycomponent extends HTMLElement {
 connectedCallback() {
 console.log("Element DOM'a eklendi.");
 document.write("Merhaba Component");
 }
 disconnectCallback() {
 document.write("Bittiı");
 }
}

customElements.define("my-component",Mycomponent);