美文网首页
vue全局方法解决ios输入法收回时的bug

vue全局方法解决ios输入法收回时的bug

作者: 不再犹豫Debug | 来源:发表于2020-03-30 09:51 被阅读0次

直接上代码

// 全局指令  
const windowHeight = window.innerHeight
Vue.directive('fixedInput', function (el, binding) {
  el.addEventListener('blur', function () {
    let windowFocusHeight = window.innerHeight
    if (windowHeight == windowFocusHeight) {
      return
    }
    let currentPosition;
    let speed = 1; //页面滚动距离
    currentPosition = document.documentElement.scrollTop || document.body.scrollTop;
    currentPosition -= speed;
    window.scrollTo(0, currentPosition); //页面向上滚动
    currentPosition += speed; //speed变量
    window.scrollTo(0, currentPosition); //页面向下滚动
  })
})

调用

<input v-fixedInput="true" type="text" v-model="username01" placeholder="用户名">

相关文章

网友评论

      本文标题:vue全局方法解决ios输入法收回时的bug

      本文链接:https://www.haomeiwen.com/subject/ctymuhtx.html