Блог

Главная - Вопросы по программированию - Как фильтровать массив в зависимости от пользовательского ввода в Javascript?

Как фильтровать массив в зависимости от пользовательского ввода в Javascript?

#javascript #arrays #json #vue.js #filter

Вопрос:

У меня есть приложение, которое использует Javascript и фреймворк VueJS. Я пытаюсь создать «выпадающий список» элементов, которые фильтруются в зависимости от того, что вводит пользователь.

Вот код для отображения списка на странице:

 <div>
    <v-list v-for="item in userInputedFormulas" :key="item.id" >
        <v-list-item>
            <v-list-item-title>
                {{ item.name }} {{ item.structure }}
            </v-list-item-title>
        </v-list-item>
    </v-list>
</div>

Вот метод, с помощью которого генерируется userInputedFormulas:

 userInputedFormulas() {
    this.userInput.forEach(element => {
        if(this.allFormulas?.filter(formula => formula.name.includes(element.toLowerCase()))) {
            filteredList = this.allFormulas?.filter( 
                formula => formula.name.includes(this.userInput)
            );
        } if(this.userInput == this.allFormulas?.filter(formula => formula.name)) {
            filteredList = this.allFormulas?.filter(formula => formula.name = this.userInput)
        }
    });
    return filteredList;
}

Обратите внимание, что allFormulas в основном возвращает массив объектов всех формул, например [{имя: «СУММА», структура: «бла»}, {имя: «ДОБАВИТЬ», структура: «бла»}, {имя: «МИНУС», структура: «бла»}]

Это работает в том смысле, что он фильтрует список «формул», например, во время ввода пользователем:

введите описание изображения здесь

Однако, когда пользователь вводит символ ( — круглая открывающая скобка), я хочу отфильтровать его так, чтобы он отображал только точную формулу.

Например, пользователь вводит «СУММА (» , тогда вместо рисунка выше, где показаны все элементы, в названии которых указано «СУММА», должен отображаться только элемент «СУММА». Как я мог бы отфильтровать это, поскольку я не уверен, как идти дальше?

Ответ №1:

Не могли бы вы сопоставить поисковый запрос с регулярным выражением, и если присутствует круглая открывающая скобка, вы переключаете функциональность с фильтрации массива на поиск только того, который подходит?

Ответ №2:

Я вижу два варианта:

Вариант А: Я предполагаю, что ваше регулярное выражение выглядит так (упрощенно): ^(TERM)/gm . Если пользователь вводит a ( , вы можете изменить регулярное ^(TERM)$/gm выражение, заменив скобку знаком доллара, чтобы заставить регулярное выражение оценивать весь термин, а не только его части.

Вариант B: Более чистым подходом было бы определить регулярное выражение для каждого элемента результата и использовать это конкретное регулярное выражение для оценки поискового запроса, например, что-то вроде этого для функции SUM: ^SUM((([d,s] ))?)?/gm (Отказ от ответственности: я не эксперт по регулярным выражениям)

Метки: