From ac100de8d8e0fc85e34cde9aec6262259b12f96c Mon Sep 17 00:00:00 2001
From: Cristiano Magro <cristiano.magro@vola.it>
Date: Mon, 30 Dec 2024 21:53:48 +0100
Subject: [PATCH] style scoped locali

---
 08 - component communication/cmp-communication-01-starting-setup/src/components/FriendContact.vue |   37 +++++++++++++++++++++++++++++++++++++
 1 files changed, 37 insertions(+), 0 deletions(-)

diff --git a/08 - component communication/cmp-communication-01-starting-setup/src/components/FriendContact.vue b/08 - component communication/cmp-communication-01-starting-setup/src/components/FriendContact.vue
new file mode 100644
index 0000000..0e2cff6
--- /dev/null
+++ b/08 - component communication/cmp-communication-01-starting-setup/src/components/FriendContact.vue
@@ -0,0 +1,37 @@
+<template>
+  <li>
+    <h2>{{ friend.name }}</h2>
+    <button @click="toggleDetails">{{ detailsAreVisible ? 'Hide' : 'Show' }} Details</button>
+    <ul v-if="detailsAreVisible">
+      <li>
+        <strong>Phone:</strong>
+        {{ friend.phone }}
+      </li>
+      <li>
+        <strong>Email:</strong>
+        {{ friend.email }}
+      </li>
+    </ul>
+  </li>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      detailsAreVisible: false,
+      friend: {
+        id: "manuel",
+        name: "Manuel Lorenz",
+        phone: "0123 45678 90",
+        email: "manuel@localhost.com",
+      },
+    };
+  },
+  methods: {
+    toggleDetails() {
+      this.detailsAreVisible = !this.detailsAreVisible;
+    }
+  }
+};
+</script>
\ No newline at end of file

--
Gitblit v1.8.0