LWC c текстовым инпутом с активными подсказками

LWC c текстовым инпутом с активными подсказками

Думаю, что таких кастомных решений множество, и возможно у вас есть какие то варианты на примете.

помните как работает стандартный лук-ап инпут? ты вводишь что-то в поле, и внизу всплывают подсказки-варианты.

вот нужно такое же, но к примеру для текстового поля. То есть в LWC есть текстовый инпут с лейблом Last Name, и когда пользователь что-то вводит, внизу появляются подсказки из уже существующих фамилий на контакт записях.

при этом эти подсказки не обязательно должны быть selectable.

так же не путайте активный поиск, когда юзер что-то вводит, а внизу активно фильтруется/выводится какая-то таблица записей. В данном случае нужны просто "подсказки".

спасибо

Den Brown
Думаю, что таких кастомных решений множество, и возможно у вас есть какие то варианты на примете.

помните как работает стандартный лук-ап инпут? ты вводишь что-то в поле, и внизу всплывают подсказки-варианты.

вот нужно такое же, но к примеру для текстового поля. То есть в LWC есть текстовый инпут с лейблом Last Name, и когда пользователь что-то вводит, внизу появляются подсказки из уже существующих фамилий на контакт записях.

при этом эти подсказки не обязательно должны быть selectable.

так же не путайте активный поиск, когда юзер что-то вводит, а внизу активно фильтруется/выводится какая-то таблица записей. В данном случае нужны просто "подсказки".

спасибо

а можешь картинку прикрепить, чтобы стало понятней?

а то я прочитал половину и подумал про фильтрацию и список опшенов к выбору, а потом прочитал в конце что ты не про это)

Maxim Elets
подумал про ... список опшенов к выбору

правильно подумал

я имел ввиду, что не такой вариант как например здесь:
https://trailhead.salesforce.com/content/learn/projects/lwc-build-flexible-apps/composition

где юзер вводит имя медведя, и перегружается вся таблица (тайлы) медведей.

Теперь ты меня окончательно запутал... У тебя есть инпут, ты в него что-то вводишь, и согласно введеного текста у тебя что-то где-то фильтруется и показывается?

Если я прав, то

<lightning-input type="search"

onchange={handleSearchTermChange}
variant="label-hidden"
class="slds-var-m-bottom_small"
label="Search"
placeholder="Search for bears"
value={searchTerm}>
</lightning-input>

handleSearchTermChange - метод который фильтрует что-то и перерисовывает. В нем ты можешь через event.target.value получить введенное значение

я имел ввиду вот такой вариант:
https://newstechnologystuff.com/2019/05/01/custom-lookup-in-lightning-web-components/

или вот такой:
https://getoncrm.com/how-to-create-re-usable-and-lookup-dropdown-lightning-web-components/

вот здесь мультиселект версия:
https://newstechnologystuff.com/2019/08/25/lightning-web-components-multi-select-custom-lookup/

PS:
Эх, еще б они были accessible, допиливать придется

Interesting information? Help us, post link to social media..