Обрабатывать начальные пробелы и специальные символы в React js onInput

Question

Я хочу запретить пользователю вводить несколько пробелов и специальных символов в поле ввода. Я сделал это ..... Но когда пользователь вставляет данные, которые содержат более одного пробела, он может вставить, я хочу обрезать первую букву и начинать первые пробелы только в случае, если пользователь что-то пишет или вставляет. Мой код изменения дескриптора: Упоминание ниже

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 в то же время или не могу заменить handleChange на onInput. Могут ли некоторые предложить мне хорошие решения? Спасибо