Components

PinInput 验证码

分段验证码 / OTP 输入，自动跳格与退格回退。

OTP 与掩码

otp 模式 6 位，mask 隐藏输入。

短信验证码 (OTP)

密钥掩码

OTP 值：—

<div class="flex flex-wrap items-end gap-8">
  <div class="space-y-2">
    <Label>短信验证码 (OTP)</Label>
    <PinInput v-model="otp" otp />
  </div>
  <div class="space-y-2">
    <Label>密钥掩码</Label>
    <PinInput v-model="masked" :length="4" mask />
  </div>
</div>
<p class="mt-3 text-xs text-slate-500 dark:text-slate-400">OTP 值：{{ otp.join('') || '—' }}</p>

API 参考

属性	类型	默认值	说明
model-value	string[]	[]	v-model 分段字符数组。
length	number	otp ? 6 : 4	段数。
otp	boolean	false	OTP 模式（自动跳格、粘贴填充）。
mask	boolean	false	掩码显示。
type	'text' \| 'number'	number	输入字符集。