reset dropdown position when writing

This commit is contained in:
arabcoders 2025-08-22 17:21:39 +03:00
parent cde6d956bb
commit 2adc529a5b
2 changed files with 21 additions and 1 deletions

View file

@ -88,7 +88,16 @@ const setDropdownItemRef = (el: Element | ComponentPublicInstance | null, idx: n
dropdownItemRefs.value[idx] = el instanceof HTMLElement ? el : null
}
watch(filteredOptions, () => dropdownItemRefs.value = Array(filteredOptions.value.length).fill(null))
watch(filteredOptions, () => {
highlightedIndex.value = filteredOptions.value.length ? 0 : -1
dropdownItemRefs.value = Array(filteredOptions.value.length).fill(null)
nextTick(() => {
const dropdown = document.querySelector('.dropdown-content')
if (dropdown) {
dropdown.scrollTop = 0
}
})
})
const handleKeydown = (e: KeyboardEvent) => {
if (!filteredOptions.value.length) {

View file

@ -82,6 +82,17 @@ const onInput = () => {
highlightedIndex.value = (showList.value && filteredOptions.value.length && lastWord.length > 0) ? 0 : -1
}
// Reset scroll position when filtered options change
watch(filteredOptions, () => {
highlightedIndex.value = filteredOptions.value.length > 0 && showList.value ? 0 : -1
nextTick(() => {
const dropdown = document.querySelector('.dropdown-content')
if (dropdown) {
dropdown.scrollTop = 0
}
})
})
const hideList = () => setTimeout(() => { showList.value = false; highlightedIndex.value = -1 }, 100)
const onKeydown = (e: KeyboardEvent) => {