aboutsummaryrefslogtreecommitdiff
path: root/src-vue/src/components/HelloWorld.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src-vue/src/components/HelloWorld.vue')
-rw-r--r--src-vue/src/components/HelloWorld.vue38
1 files changed, 38 insertions, 0 deletions
diff --git a/src-vue/src/components/HelloWorld.vue b/src-vue/src/components/HelloWorld.vue
new file mode 100644
index 00000000..52309103
--- /dev/null
+++ b/src-vue/src/components/HelloWorld.vue
@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+
+defineProps<{ msg: string }>()
+
+const count = ref(0)
+</script>
+
+<template>
+ <h1>{{ msg }}</h1>
+
+ <div class="card">
+ <button type="button" @click="count++">count is {{ count }}</button>
+ <p>
+ Edit
+ <code>components/HelloWorld.vue</code> to test HMR
+ </p>
+ </div>
+
+ <p>
+ Check out
+ <a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
+ >create-vue</a
+ >, the official Vue + Vite starter
+ </p>
+ <p>
+ Install
+ <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+ in your IDE for a better DX
+ </p>
+ <p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
+</template>
+
+<style scoped>
+.read-the-docs {
+ color: #888;
+}
+</style>