From 1c23dde48a0aaa75a697acbfc4d282956aa3eab6 Mon Sep 17 00:00:00 2001
From: Gopikrishna-Gurivisetti <gopikrishna.500apps@gmail.com>
Date: Fri, 5 Apr 2024 18:00:45 +0530
Subject: [PATCH] managing reactive data and handling events

---
 templates/basic/app.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/templates/basic/app.vue b/templates/basic/app.vue
index 721d7381..727b6ea9 100644
--- a/templates/basic/app.vue
+++ b/templates/basic/app.vue
@@ -1,7 +1,12 @@
 <script setup lang="ts">
-const msg = 'Hello World! This is the basic template.'
+import { ref } from 'vue';
+const msg = ref('Hello World! This is the basic template.');
+const changeMessage = () => {
+  msg.value = 'This is Basic Nuxt Template';
+};
 </script>
 
 <template>
   <div>{{ msg }}</div>
+  <button @click="changeMessage">Click Me</button>
 </template>