时间戳

首页 > 解决方案 > 使用 Redux 表单和输入掩码验证用户输入的特定长度的电话号码

redux-form - 使用 Redux 表单和输入掩码验证用户输入的特定长度的电话号码

问题描述

即使用户只输入了 1 个数字，验证也不起作用，我认为 Inputmask 的 maskChar 值出现了问题。

               <Field
                component={NumberField}
                name="phone"
                mask="+1 (999) 999-9999"
                placeholder="Phone"
              />```

```
         <InputMask
          mask={mask}
          maskChar={maskChar}
          {...input}
          value={toUpper && input.value.trim()}
          label={label}
          onFocus={() => isActive(true)}
          onBlur={() => isActive(false)}
          placeholder={active ? '' : thePlaceholder}
          aria-label={label}
          type={type}
          required={required}
        />
`
``

标签： redux-forminput-mask

解决方案

如果你对新的 NPM 包没有问题，这个看起来不错： https ://www.npmjs.com/package/validator

或者这个：

https://catamphetamine.github.io/react-phone-number-input/

https://github.com/catamphetamine/react-phone-number-input

或者你可以检查这个SO answer

推荐阅读