Функция поиска .match() с учетом регистра

#javascript #vue.js

#javascript #vue.js

Вопрос:

this.items представляет собой массив объектов. Я использую это для поиска элементов по строке поиска, но .match() чувствителен к регистру. Например, если у меня есть вызываемый элемент Milk , при вводе milk он не появится.

Как я могу заставить это работать как для нижнего, так и для верхнего регистра? Живая демонстрация

 filteredOffers() {
    return this.items.filter((offer) => {
        return offer.title.match(this.search);
    });
},
 

Я пытался:

 offer.title.match(/this.search/i);
 

но это дает мне пустую страницу.

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

1. вам нужно добавить регулярное выражение в первый аргумент match() , что такое this.search ?

2. это поле поиска. Я добавил ссылку с живым просмотром.

Ответ №1:

Преобразуйте два термина в нижний регистр перед их сравнением:

 export default {
  computed: {
    filteredOffers() {
      const searchTerm = this.search.toLowerCase();
      return this.items.filter((offer) => {
        return offer.title.toLowerCase().match(searchTerm);
      });
    }
  }
}
 
 const items = [
  { title: 'Foo bar' },
  { title: 'The Milk Is Delicious' },
  { title: 'Baz qux' },
  { title: 'I drink chocolate milk' },
]

const search = 'milk'
const searchTerm = search.toLowerCase()
const result = items.filter((offer) => {
  return offer.title.toLowerCase().match(searchTerm)
})

console.log(result)