defineProps、defineEmits、defineExpose组件通信

在使用这个之前，我们需要知道setup的语法糖写法，因为上面的三个api需要在这个语法糖中才能使用：

里面的代码会被编译成组件 setup() 函数的内容。
这意味着与普通的 

页面：

不需要主动暴露return。

使用组件：

子组件：

页面：

defineProps、defineEmits、defineExpose这三个api我们可以直接使用并不需要在vue中单独暴露出来

defineProps

其实我们使用的时候完全可以不导入。
目前页面：

因为我们目前还没有给子组件传入name、age，所以使用的默认值。
在父组件传入name、age:

写法完全和v2一致，使用v-bind或者:即可达到效果。
当前页面：

已经收到了传入的值。

defineEmits

defineProps为了解决子组件接受父组件传入的值，那defineEmits就是子组件给父组件传值，当然这个传值是以回调函数的形式传送。
使用的前提是需要父组件传入回调函数，子组件使用defineEmits接受，触发事件。

子组件使用：

页面：

点击后页面：

defineExpose

用于父组件要使用子组件中的方法或者属性的时候，子组件暴露给父组件，父组件配合ref使用：

子组件：

父组件：

页面：

子组件暴露，父组件ref接受。