一句话总结：通过定义组件的接收属性（props），父组件可以向子组件传递数据，而子组件需要显式声明其预期接收的
props
基本使用
<template>
<div>
{{a}}
</div>
</template>
<script lang="ts" setup name="Person">
import { defineProps } from 'vue';
defineProps(['a'])
</script>
defineProps的返回值
<template>
<div>
{{a}}
</div>
</template>
<script lang="ts" setup name="Person">
import { defineProps } from 'vue';
const res = defineProps(['a'])
console.log(res);
</script>
限制props的类型
defineProps后面可以加泛型，用于限制传入参数的类型。
<script lang="ts" setup name="Person">
import { defineProps } from 'vue';
import { type Person } from '@/type'
const res = defineProps<{person: Person}>()
</script>
给props指定默认值
使用withDefaults函数，可以指定props的默认值
<script lang="ts" setup name="Person">
import { defineProps, withDefaults } from 'vue';
import { type Person } from '@/type'
withDefaults(defineProps<{person?: Person}>(), {
person: ()=>{
return { name: '暂无名称', age: 0 }
}
})
</script>
