类型校验和默认值设置是防止组件崩溃的必要手段，需结合proptype明确复杂类型、validator校验业务规则、工厂函数提供引用类型默认值，并用冒号确保正确传值。
类型校验和默认值设置不是可选项，而是防止组件意外崩溃的必要手段。Vue 的 props 校验在开发阶段给出警告，但若不配合合理默认值与类型约束，生产环境仍可能因数据缺失或类型错位引发逻辑错误甚至白屏。
明确类型声明 + PropType 处理复杂结构
基础类型（String、Number 等）直接写构造函数即可，但对象、数组、联合字面量等必须用 PropType 显式标注，否则 TypeScript 编译通过，运行时校验失效：
- 数组元素需具体化：不要写
type: Array，而要写type: Object as PropType<product></product>或更简洁的products: Product[]（组合式 API 中 defineProps 泛型） - 状态枚举推荐字面量联合：如
status: 'idle' | 'loading' | 'success'，编辑器能自动提示，运行时也能拦截非法字符串 - 函数类型必须用
Function as PropType void>，避免type: Function导致参数类型丢失
validator 补足业务规则，不止于类型
TypeScript 只管“像不像”，validator 才管“对不对”。比如一个 URL 字段，类型是 String 不代表它就合法：
- 写在 props 定义里：
apiUrl: { type: String, validator: v => v && v.startsWith('https://') } - 数字范围检查：
timeout: { type: Number, validator: v => Number.isInteger(v) && v > 0 } - 对象必含字段：
config: { type: Object as PropType<config>, validator: v => v && 'baseUrl' in v && typeof v.baseUrl === 'string' }</config>
引用类型默认值必须用工厂函数
Object 和 Array 是引用类型，直接写默认值会导致多个组件实例共享同一内存地址，修改一处影响全局：
- ✅ 正确：
filters: { type: Array as PropType<string>, default: () => ['all', 'active'] }</string> - ✅ 正确：
options: { type: Object as PropType, default: () => ({ size: 'medium', theme: 'default' }) } - ❌ 错误：
default: { size: 'medium' }—— 所有实例共用这个对象
模板传值务必加冒号，避免字符串字面量陷阱
没加 : 就是静态字符串，哪怕你写的是数字或布尔字面量：
-
<user-card is-active="true"></user-card>→ 传的是字符串"true"，不是布尔值true - 正确写法：
<user-card :is-active="true" :count="10" :tags="['a','b']"></user-card> - 表单绑定尤其注意：
<input v-model="age">的age是字符串，传给需要 Number 的 prop 前得转：:age="parseInt(age)"
