首页 > 解决方案 > 在 React js onInput 中处理前导空格和特殊字符

问题描述

我想防止用户在输入字段中输入多个空格和特殊字符。我已经做到了.....但是当用户粘贴包含多个空格的数据时,它可以粘贴我想修剪第一个字母开始前导空格,以防用户写一些东西或粘贴一些东西。我的句柄更改代码在下面提及

handleChange = event => {
    //Carret Position
    const caret = event.target.selectionStart;
    const element = event.target;
    window.requestAnimationFrame(() => {
      element.selectionStart = caret;
      element.selectionEnd = caret;
    });
    console.log(event.target.value)
    // Expression to Match every field except Email
    var regExpr = /[^a-zA-Z0-9 ]/g;
    var myValue = event.target.value;
    var myName = event.target.name;

    if (caret == 0 || caret <= 1) {
      myValue = myValue.trim();
    }

    if (myName == "cliaNumber") {
      myValue = myValue ? myValue : "";
      myValue = myValue.trim();
      myValue = myValue.replace(regExpr, "");
    } else if (myName == "email") {
      myValue = myValue ? myValue : "";
      myValue = myValue;
    } else if (myName == "officePhoneNum"){
      myValue = myValue ? myValue : "";
      myValue = myValue;
    }else {
      myValue = myValue.replace(regExpr, "");
    }
    this.setState({
      pModel: {
        ...this.state.pModel,
        [myName]: myValue.toUpperCase()
      }
    });

  };

我不想同时使用 onInput 或不能用 onInput 替换我的 handleChange。有人可以建议我一些好的解决方案吗?谢谢

标签: javascriptreactjsreact-redux

解决方案


推荐阅读