remove items

serikshaikamalov · Jul 3, 2024 · 8a82271 · 8a82271
1 parent 88403b6
commit 8a82271
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/examples/basket/basketStorage.js b/examples/basket/basketStorage.js
@@ -19,6 +19,11 @@ export class BasketStorage extends EventTarget {
     getItems() {
         return this.items
     }
+    removeItem(item) {
+        this.items = this.items.filter(i => i != item)
+        console.log("this.items: ", this.items);
+        this.dispatchEvent(new CustomEvent("updated", { detail: { item } }))
+    }
 }
 
 const basketStorage = BasketStorage.getInstance();

diff --git a/examples/basket/main.js b/examples/basket/main.js
@@ -15,6 +15,7 @@ export class Basket extends LitElement {
     connectedCallback() {
         super.connectedCallback();
         basketStorage.addEventListener("updated", (i) => {
+            console.log("Updated");
             this.items = basketStorage.getItems()
         })
     }
@@ -30,6 +31,10 @@ export class Basket extends LitElement {
         searchNode.value = ""
     }
 
+    remove(i) {
+        basketStorage.removeItem(i)
+    }
+
     render() {
         return html`
             <form @submit=${this.submit}>
@@ -39,7 +44,7 @@ export class Basket extends LitElement {
                 </div>
                 <div>
                     ${this.items ? html`${this.items.map(i => {
-            return html`<div>${i}</div>`
+            return html`<div>${i} <button type="button" @click=${() => this.remove(i)}>remove</button></div>`
         })}` : html`<h2>No items</h2>`}
                 </div>
             </form>