处理键盘展开收起导致页面异常

2023-09-24  本文已影响0人  Mr老朝

使用自定义指令:

Vue.directive('fixKeyBoardBug', {
  inserted(el) {
    let timer = null;
    const fixKeyBoardBugFocus = function () {
        timer && clearTimeout(timer);
    };
    const fixKeyBoardBug = function () {
        timer = setTimeout(() => {
            var scrollTop = window.scrollTop;
            window.scrollTo(0, 0);
            setTimeout(() => {
                window.scrollTo(0, scrollTop);
            }, 0);
        }, 100);
    };
    el.addEventListener('blur', fixKeyBoardBug);
    el.addEventListener('focus', fixKeyBoardBugFocus)
  }
});

使用:

<input v-fixKeyBoardBug type="tel" maxlength="11" v-model="phone" />
上一篇 下一篇

猜你喜欢

热点阅读