谢一一

微信这BUG好久了，据说是浏览器的锅~~~

本来想用 @blur 事件，后来想想还是要多用用别的方法。



局部自定义指令

// *.vue写在data()同级
directives: {
    drop: {      
      inserted: function (el) {
        let userUA = navigator.userAgent;
        if (userUA.indexOf('iPhone') > -1){  
           el.onblur = function(){              
                setTimeout(function(){
                  var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
                  window.scrollTo(0, Math.max(scrollHeight - 1, 0)); 
                },100)  
            }
        }
      }
    }
  },

或者全局定义指令

//main.js
Vue.directive('drop', {  
  inserted: function (el) {
    let userUA = navigator.userAgent;
    if (userUA.indexOf('iPhone') > -1){  
       el.onblur = function(){              
            setTimeout(function(){
              var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
              window.scrollTo(0, Math.max(scrollHeight - 1, 0)); 
            },100)  
            console.log(userUA)
        }
    }
  }
})

然后给页面的input和select加上指令 v-drop

<input type="" v-drop>
 <select v-drop></select>

以前做H5没用VUE的时候，是用的下面的代码

//记得引入JQ

let userUA = navigator.userAgent; 
if (userUA.indexOf('iPhone') > -1){             
    $("input,select").blur(function(){              
      setTimeout(function(){
        var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
        window.scrollTo(0, Math.max(scrollHeight - 1, 0));               
      },100)

    })
 }