Проверка регулярного выражения в vue.js событие нажатия клавиши в поле ввода

#javascript #vue.js

#javascript #vue.js

Вопрос:

Регулярное выражение отлично проверяет путь к файлу Linux. Но keypress событие не позволяет пользователю вводить первую допустимую букву самостоятельно. Когда я начинаю вводить первую букву как / , e.target.value печатается как пустое пространство в журнале консоли.

 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<input
 type="text"
 class="inputChange validate"
 :id="item.name"
 :disable="false"
 v-model="item['name']"
 @keypress="validateLinuxPath"
/>  

 validateLinuxPath(e) {
      let pattern = /^/$|(/[a-zA-Z_0-9-] ) $/;
      let res = pattern.test(e.target.value);
      if (!res) {
        e.preventDefault();
        return false;
      }
    },  

Комментарии:

1. К вашему сведению, нажатие клавиши больше не рекомендуется — developer.mozilla.org/en-US/docs/Web/API/Document /…

2. ваша проблема в том, что событие нажатия клавиши запускается ДО того, как символ добавляется к значению ввода… let res = pattern.test(e.key e.target.value); таким образом, вы можете вернуться false , и значение ввода не изменится

Ответ №1:

Вы можете изменить pattern.test(например,target.value) на e.key.match(шаблон)

 validateLinuxPath() {
  let pattern = /^/$|(/[a-zA-Z_0-9-] ) $/;
  let res = event.key.match(pattern);
  if (!res) {
    event.preventDefault();
    return false;
  }
}