InputOtp 验证码输入

规则

基础示例

Props 配置示例

密码模式与校验状态

限制可输入字符

禁用与只读对比

Events 事件示例

完整配置项请参考: naive-ui_InputOtp

value（表单）

• 与示例及解析器习惯一致时，可使用 string[]（每一位对应一个格子）；亦可通过 props 与 Naive UI 受控 value（string \| null 等）组合使用，以当前 naive-ui 版本类型定义为准。

InputOtp Props

名称	类型	默认值	说明
allowInput	(char: string, index: number, currentValue: string[]) => boolean	undefined	校验单次输入是否合法，返回 false 则忽略本次输入（2.41.1+）
block	boolean	false	是否撑满父级宽度（2.42.0+）
defaultValue	string[]	[]	非受控默认值（2.41.1+）
disabled	boolean	false	是否禁用
gap	string | number	undefined	格子间距
length	number	6	格子数量
mask	boolean	false	密码遮罩
placeholder	string	''	占位
readonly	boolean	false	只读
size	'small' | 'medium' | 'large'	'medium'	尺寸
status	'success' | 'warning' | 'error'	undefined	校验状态
value	string | null	undefined	受控值（与 Naive 文档一致；表单中可结合 string[] 使用）
onBlur	(event: FocusEvent, index: number) => void	undefined	整体失焦
onFinish	(value: string[]) => void	undefined	填满时触发
onFocus	(event: FocusEvent, index: number) => void	undefined	整体聚焦
onUpdateValue	(value: string[], meta: { diff: string, index: number, source: 'input' | 'delete' | 'paste' }) => void	undefined	值变化；meta 说明见 Naive 文档