Question

这是我到目前为止所拥有的。我试图将第一个字符限制为仅字母，因此将第一个字符替换为字母。

const validateMyField = (currentFieldValue, event) => {
    if (currentFieldValue.match(/^[a-zA-Z0-9][a-zA-Z0-9_.-]*$/)) {
        return true;
    }
    return false;
};
const templateNameValidator = createValidator(
    validateMyField,
    'You are attempting to paste with characters that are not allowed. Please remove characters and try again. (Special characters can only include "_","-",".")'
);

<Field
     className="text-input"
     component={Textarea}
     label="Template Name"
     name="name"
     maxLength={128}
     minRows={1}
     placeholder="Enter Template Name..."
     validate={composeValidators(required, templateNameValidator)}
 normalize={format}/>
    export default reduxForm({
    form: 'templateForm',
    destroyOnUnmount: false,
    validate: generateValidation({
        name: templateNameValidator
    })

Answer 1

您可以在字段中使用onChange函数，以对输入进行功能控制。

添加有关控制输入值的信息

<Field
 className="text-input"
 component={Textarea}
 label="Template Name"
 name="name"
 maxLength={128}
 minRows={1}
 placeholder="Enter Template Name..."
 validate={composeValidators(required, 
 templateNameValidator)}
 normalize={format}

 value={this.inputValue}
 onChange={this.noNumberFirst}
/>

在底部添加了onChange函数

您的课程将包含一个类似以下内容的属性：

 inputValue = ""

然后onChange函数可能类似于......

const noNumberFirst = event => {
  const input = event.target.value
  const pattern = new RegExp("/^[a-zA-Z]/")
  if (!pattern.test(input[0])) {
    // Here you have a bad test on your element and you can alert the user
  } else {
    // This means they have passed in an acceptable value and can continue 
    // moving on with their input
   this.inputValue = e.target.value
  }

我选择向您展示此方法，因为它非常简单，并且应该很容易理解

限制用户在React的输入字段的第一个字符中键入数字和字符

1 个答案: