Vue3：组件间通信-props方式实现父子组件间通信

一、情景说明

父子组件间的数据通信
props是使用频率最高的一种通信方式，常用于 ：父 ↔ 子

父传子：直接给组件传递变量值即可。
子传父：需要父先给子传递一个函数，子调用该函数传递变量值。

二、案例

1、父传子
父组件

<Child :car="car"/>

子组件

// 声明接收props
defineProps(['car'])

<h4>父给的车：{{ car }}</h4>

2、子传父
父组件先给子一个函数

<Child :car="car" :sendToy="getToy"/>

// 方法
function getToy(value:string){
	toy.value = value
}

子组件

// 声明接收props
defineProps(['car','sendToy'])

<button @click="sendToy(toy)">把玩具给父亲</button>