如何在flutter中使用Pinput小部件

Question

我正在尝试创建一个otp字段，我可以手动填写该字段，稍后进行验证。我正在使用Pinput软件包，因为它很受欢迎。我面临以下问题-

1. 除非我输入./，否则pin不会开始键入，在第一个字段
2. 输入最后一个数字后，Pinput((字段就会被清除
3. 如何使用此pin并稍后进行验证

我的代码是-

Pinput(
length: 6,
keyboardType: TextInputType.number,
controller: pinController,
defaultPinTheme: defaultPinTheme,
focusedPinTheme: focusedPinTheme,
submittedPinTheme: submittedPinTheme,
pinputAutovalidateMode: null,
textInputAction: TextInputAction.next,
showCursor: true,
validator: (s) {
print('validating code: $s');
},
onCompleted: null,
),

请帮忙！！

Answer 1

1. 这样使用onCompleted而不是null

onCompleted: (pin) => print(pin),

这个onCompleted方法就像输入完成一样，做一些导航或检查

2. 当您输入最后一个数字时，将打印您需要使用regex来验证搜索并获得所需内容

// In validator you can check 
Int validDigit = 1234; // this is test digit
Validator: (input){
return s == validDigit ? null : 'Pin is incorrect';
}

Validator的工作原理类似于您的输入数字与您需要的模式不一样，在这种情况下，如果输入数字与发送给用户的代码不相等，则需要返回error，否则返回null，这意味着代码是正确的。

例如，validDigit来自api或其他

3. 最后设置自动验证，如此处所示，不为null：

pinputAutovalidateMode: PinputAutovalidateMode.onSubmit,

我希望它能起作用，很抱歉他们不符合你的问题。