From 27271c7e9ab9a9663e3c5c083cf6635fd9bc6ffb Mon Sep 17 00:00:00 2001
From: 62651a3279fbdd78c800902f <62651a3279fbdd78c800902f@devide>
Date: Wed, 17 May 2023 09:33:19 +0000
Subject: [PATCH] UPDATE

---
 src/App.vue                                   |  4 +--
 src/page/child.vue                            | 11 -------
 src/page/parent.vue                           | 10 ------
 .../child.vue"                                | 30 ++++++++++++++++++
 .../parent.vue"                               | 31 +++++++++++++++++++
 5 files changed, 63 insertions(+), 23 deletions(-)
 delete mode 100644 src/page/child.vue
 delete mode 100644 src/page/parent.vue
 create mode 100644 "src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/child.vue"
 create mode 100644 "src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/parent.vue"

diff --git a/src/App.vue b/src/App.vue
index 90cdc2e..b7aed98 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,9 +1,9 @@
 <script setup>
-
+import parent from './子组件传值给父组件/parent.vue';
 </script>
 
 <template>
-  
+  <parent></parent>
 </template>
 
 <style scoped>
diff --git a/src/page/child.vue b/src/page/child.vue
deleted file mode 100644
index 19748ff..0000000
--- a/src/page/child.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup>
-import { defineEmits } from 'vue';
-const emit = defineEmits(["value"])
-</script>
-
-<template>
-  <button @click="add">点我加一</button>
-</template>
-
-<style scoped>
-</style>
\ No newline at end of file
diff --git a/src/page/parent.vue b/src/page/parent.vue
deleted file mode 100644
index b9ac528..0000000
--- a/src/page/parent.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<script setup>
-import child from './child.vue';
-</script>
-
-<template>
-  <child></child>
-</template>
-
-<style scoped>
-</style>
\ No newline at end of file
diff --git "a/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/child.vue" "b/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/child.vue"
new file mode 100644
index 0000000..365c3ec
--- /dev/null
+++ "b/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/child.vue"
@@ -0,0 +1,30 @@
+<script setup>
+import { defineEmits } from 'vue';
+// 这里就相当于一个声明，告诉父组件，我子组件会传哪些值
+const emit = defineEmits(["value"])
+
+const val = () => {
+  emit("value", "旅行者，当你重新踏上旅途...")
+}
+</script>
+
+<template>
+  <div class="title">
+    <h3>我是子组件</h3><br/>
+    <button @click="val">点击获取子组件的值</button>
+  </div>
+  
+</template>
+
+<style scoped>
+.title {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba(255, 0, 234, 0.377);
+  
+}
+.title:hover {
+  filter: drop-shadow(0 0 2em rgb(255, 1, 255));
+}
+</style>
\ No newline at end of file
diff --git "a/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/parent.vue" "b/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/parent.vue"
new file mode 100644
index 0000000..3707582
--- /dev/null
+++ "b/src/\345\255\220\347\273\204\344\273\266\344\274\240\345\200\274\347\273\231\347\210\266\347\273\204\344\273\266/parent.vue"
@@ -0,0 +1,31 @@
+<script setup>
+import { ref } from 'vue';
+import child from './child.vue';
+
+const game = ref("");
+const getVal = (data) => {
+  game.value = data;
+}
+</script>
+
+<template>
+  <child @value="getVal"></child>
+  <div class="content">
+    <div>
+      获取子组件的值：{{ game }}
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.content {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba(115, 255, 0, 0.377);
+  
+}
+.content:hover {
+  filter: drop-shadow(0 0 2em rgb(1, 255, 14));
+}
+</style>
\ No newline at end of file
-- 
GitLab