fix: 更新滚动脚本

Author: ArgoZhang

src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js

@@ -26,13 +26,16 @@ export function init(id, invoke) {
     if (duration > 0) {
         ac.debounce = true
         EventHandler.on(input, 'keyup', debounce(e => {
+            e.preventDefault();
             handlerKeyup(ac, e);
         }, duration, e => {
             return ['ArrowUp', 'ArrowDown', 'Escape', 'Enter', 'NumpadEnter'].indexOf(e.key) > -1
         }))
     }
     else {
         EventHandler.on(input, 'keyup', e => {
+            e.stopPropagation();
+            e.preventDefault();
             handlerKeyup(ac, e);
         })
     }
@@ -127,26 +130,12 @@ const handlerKeyup = (ac, e) => {
         else if (index > items.length - 1) {
             index = 0;
         }
-        items[index].classList.add('active');
-        const top = getTop(menu, index);
-        const hehavior = el.getAttribute('data-bb-scroll-behavior') ?? 'smooth';
-        menu.scrollTo({ top: top, left: 0, behavior: hehavior });
+        current = items[index];
+        current.classList.add('active');
+        scrollIntoView(el, current);
     }
 }
 
-const getTop = (menu, index) => {
-    const styles = getComputedStyle(menu)
-    const maxHeight = parseInt(styles.maxHeight) / 2
-    const itemHeight = getHeight(menu.querySelector('.dropdown-item'))
-    const height = itemHeight * index
-    const count = Math.floor(maxHeight / itemHeight);
-    let top = 0;
-    if (height > maxHeight) {
-        top = itemHeight * (index > count ? index - count : index)
-    }
-    return top;
-}
-
 export function showList(id) {
     const ac = Data.get(id)
     if (ac) {
@@ -177,4 +166,9 @@ export function dispose(id) {
     }
 }
 
+const scrollIntoView = (el, item) => {
+    const behavior = el.getAttribute('data-bb-scroll-behavior') ?? 'smooth';
+    item.scrollIntoView({ behavior: behavior, block: "nearest", inline: "start" });
+}
+
 export { handleKeyUp, select, selectAllByFocus, selectAllByEnter }

src/BootstrapBlazor/Components/Select/Select.razor.js

@@ -141,5 +141,5 @@ function indexOf(el, element) {
 
 const scrollIntoView = (el, item) => {
     const behavior = el.getAttribute('data-bb-scroll-behavior') ?? 'smooth';
-    item.scrollIntoView({ behavior: behavior, block: "center", inline: "nearest" });
+    item.scrollIntoView({ behavior: behavior, block: "nearest", inline: "start" });
 }

src/BootstrapBlazor/Components/TreeView/TreeView.razor.js

@@ -32,7 +32,7 @@ export function scroll(id, options) {
     const el = document.getElementById(id);
     const item = el.querySelector(".tree-content.active");
     if (item) {
-        item.scrollIntoView(options ?? { behavior: 'smooth', block: 'start', inline: 'nearest' });
+        item.scrollIntoView(options ?? { behavior: 'smooth', block: 'nearest', inline: 'start' });
     }
 }