Предыстория
Немного лирики.
Выбирал я как-то в одном интернет магазине одежду. Сам запрос в каталоге товаров приходилось “делить” на 2 части: что-то выбирать в фильтре, а что-то вписывать руками в поиск. И тут внезапно что-то щелкнуло в голове: а не проще ли все вводить руками, при этом чтобы фильтры выбирались сами из запроса? И чтобы при этом на бэк отправлять только набор фильтров, а не всю строку? Вроде бы вся информация на странице поиска для этого есть. Да и быстрее это, чем искать нужный фильтр и запоминать где он находится. Да и потом, дизайн сайта может измениться, фильтры могут переехать в другое место (запоминай заново, мелочь конечно, но все-таки), а строка поиска останется неизменной по функционалу.
Именно эти размышления подтолкнули меня на написание следующего плагина.
Итак, ближе к делу.
Установка
Плагин доступен в npm
npm i smart-search-site-engine
Также есть CDN
Пример использования
Более подробный пример есть на гите
import { S3e } from 'smart-search-site-engine'import type { S3eFilters, S3eThreshold } from 'smart-search-site-engine/dist/types';const filters: S3eFilters[] = [ { name: "clothes", options: [ { value: "t-shirt", descriptions: "футболка" }, { value: "pants", descriptions: "штаны, брюки" } ] }, { name: "material", options: [ { value: "cotton", descriptions: "хлопок, хлопковый" }, { value: "flax", descriptions: ["лен", "льна", "льняной"] } ] }, { name: "details", options: [ { value: "short_sleeve", descriptions: "короткий рукав", }, { value: "long_sleeve", descriptions: "длинный рукав", } ] }];const se = new S3e(filters);// В запросе намеренно допущены опечаткиse.find("купить хлопковую футблоку с короктим рукавом")/*[ {filter: 'material', value: 'cotton'}, {filter: 'clothes', value: 't-shirt'}, {filter: 'details', value: 'short_sleeve'}]*/
Послесловие
Короче, не умею я писать длинные красивые посты, просто хотелось поделиться своей наработкой. Буду рад обратной связи.
Всем хорошего лета!)
ссылка на оригинал статьи https://habr.com/ru/articles/1043418/