Skip to content
On this page

OTPInput 验证码输入框

代码演示

基本用法

dart
OTPInput(
  autoFocus: true,
  value: model.value,
  onChange: (v) => model.value = v,
),

自定义长度

dart
const OTPInput(length: 4, value: "123"),

间距

dart
const OTPInput(gutter: 10, value: "12345"),

隐藏文字

dart
const OTPInput(obsecure: true, value: "123"),

接收输入完成事件

dart
OTPInput(
  obsecure: true,
  value: "123",
  onComplete: (chars) =>
      ToastStatic.show(context, message: "Codes: $chars"),
),

API

Props类型描述
valueString当前值
lengthint最大长度
gutterdouble间距
obsecurebool隐藏文本
autoFocusbool自动聚焦
onChangeFunction(String codes)值变化回调
onCompleteFunction(String codes)输入到达长度时触发