一 =》》 props父子传值在setup语法糖中的使用
1父组件传值和之前一样：示例代码：
<child :name="name" />
2子组件接收使用props更方便了
<script setup>
import { defineProps } from 'vue'
// 声明props
const props = defineProps({
name: {
type: String,
default: '11'
}
})
</script>
3 接收的简单写法（不校验类型的数组形式接收）
<script setup>
import { defineProps } from 'vue'
const props = defineProps(['name'])
</script>
二 =》》子组件通过emit给父组件传值的setup使用
子组件通过引入defineEmits使用，需要 通过emit触发的事件名作为参数数组的元素传递给defineEmits，defineEmits调用的结果再去触发。
<script setup>
import { defineEmits } from 'vue';
const emit = defineEmits(['sendValtoFather'])
const sendHandle = () => {
emit('sendValtoFather');
}
</script>
父组件正常监听，和之前的写法一样
<Son @sendValtoFather="sendValtoFather" />
三 =》》获取子组件ref变量在setup语法糖中的使用
在子组件上绑定ref属性是一样的。父组件通过ref获取子组件不再使用$refs.xxx 而是使用引入的ref组合式api，示例代码如下：
通过ref去定义要获取的ref绑定的dom，dom是在ref定义的变量的value属性上。
注意：获取的编程了xx.value value是必须的。
<template>
<Son ref="son" />
</template>
<script setup>
import {ref} from 'vue'
const son = ref('son')
// 点击设置
const onClickSetUp = () => {
console.log(son.value)
}
</script>
