[Vue warn]: Missing required prop: “name“问题解决

在控制台出现了这个黄色警告，就要排查是不是该属性设置了必填但父组件没传值的情况或者这个属性的值可传可不传却设置了必传的情况

如果是前一种情况，就要自己去排查了，解决思路就是该子组件的 name 为什么没拿到父组件的值？
如果是后一种情况，就设其为不必传或者给默认值

解决方法：

1. 将 required:true 去除

defineProps({
  name: {
    type: String,
　　 // required: true
  }
})

2. 设默认值

defineProps({
  name: {
    type: String,
    default: "默认值~"
  },
});

3. 充分利用 ts 特性，利用 withDefaults 设置默认值

<script setup lang="ts">
type titleProps = {
　id: number, // 必填，不可设置默认值，会报错
  name?: string; // ? 表示可选，可设默认值
};

const props = withDefaults(defineProps<titleProps>(), {
  name: "总览",
});
</script>