props 的 validator 是一个同步执行的校验函数，用于在基础类型检查后验证业务约束，接收 value 参数，返回布尔值，支持枚举、范围、格式等校验，但不可异步。
Vue Options API 中，props 的 validator 是一个函数，用于对传入的 prop 值做自定义逻辑校验，它在基础类型检查之后执行，能覆盖业务层面的约束，比如范围、枚举值、格式合法性等。
validator 函数的基本写法
validator 是 props 对象中某个 prop 的配置项之一，必须配合 type 使用（先做类型过滤，再进逻辑校验）：
- 接收一个参数：
value（当前 prop 的实际传入值）； - 返回
true表示通过，false表示失败，失败时 Vue 会在开发环境控制台抛出警告； - 不支持异步校验，必须同步返回布尔值。
常见校验场景与写法
✅ 枚举值限制（如只允许 'success' / 'error' / 'warning'）：
status: {
type: String,
validator: value => ['success', 'error', 'warning'].includes(value)
}
✅ 数值范围检查（如年龄必须在 0–120）：
age: {
type: Number,
validator: value => Number.isInteger(value) && value >= 0 && value
<p>✅ 字符串非空且长度限制（如用户名 2–16 个字符）：</p>
<pre class="brush:php;toolbar:false;">username: {
type: String,
validator: value => typeof value === 'string' && value.trim().length >= 2 && value.trim().length
<h3>validator 中访问其他 props 的技巧</h3>
<p>validator 函数默认只接收 <code>value</code>，但 Vue 2.6+ 和 Vue 3 Options API 支持三参数形式（需注意版本兼容性）：</p>
- Vue 2.6+：可写成
validator(value, props, propName)，其中props是当前组件接收到的所有 props 对象； - Vue 3（Options API）：同样支持该三参数签名，可用于跨 prop 关联校验（例如：当
required为 true 时，defaultValue不得为空）。
⚠️ 注意：如果使用 TypeScript，需显式标注参数类型，否则可能报错；且三参数形式在某些构建工具或旧版 Vue 中可能不被识别，建议优先用单参数 + 显式逻辑拆分。
结合 required 和 default 的注意事项
validator 不影响 required 和 default 的触发时机：
-
required: true检查的是 prop 是否被传入，不是值是否合法； -
default在 prop 未传或传了undefined时生效，不会绕过 validator —— 即使用了 default，生成的默认值仍会进入 validator 校验； - 若 default 返回对象/数组，记得用工厂函数（
default: () => ({})），否则会造成响应式数据共享问题。
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
