重学vue3：vue3组件通信的几种方法

1. Props（属性传递）

• 应用场景：
  适用于父组件向子组件传递数据，通常用于单向数据流。
• 流程：
  1. 父组件在子组件标签上通过属性绑定数据（使用 : 或 v-bind）。
  2. 子组件使用 defineProps 宏声明并接收这些属性。
  3. 子组件可以直接使用接收到的 props 数据。
• 代码示例：

<!-- 父组件 -->
<template>
  <ChildComponent :message="parentMessage" />
</template>

<script setup>
import { ref } from 'vue';
import ChildComponent from './ChildComponent.vue';

const parentMessage = ref('Hello from parent');
</script>

<!-- 子组件 -->
<template>
  <p>{
  { message }}</p>
</template>

<script setup>
import { defineProps } from 'vue';

const props = defineProps({
  message: String
});
</script>

2. Emits（事件发射）