TypeScrip在vue中的使用-----defineProps

小知识点：在vscode中定义好子组件的vue视图后。我们可以直接使用<子组件/>来使用子组件，因为我们使用了import插件，他会自动import

所需文件。

使用一：父向子传值，我们之前父向子传值的时候，子组件是如下：

defineProps({
    house: {
        type: String,
        required: true,
    },
});

使用了TS增加泛型，看上去代码也更加简洁（注：当我们使用vscode时，输入defineProps  会有一些提示）

defineProps<{
    house:string
}>()

当然上述写法还可以变成如下：

type propType = {
    house:string
}
defineProps<propType>()
</script>

 我们也可以在属性后面加“？”,来表示这是可选属性，那么这是可传可不传的。

type propType = {
    house?:string
}
defineProps<propType>()

可以在接收参数解构的时候设置默认值。如果父组件并没有传值过来，那么就使用默认值

type propType = {
    house?: string;
};
//设置默认值，解构的时候设置,表示父组件没有传过来就用这个默认值
const { house = "茅草屋" } = defineProps<propType>();