H5页面ios键盘遮挡input问题

完美方案// 解决输入法被激活时 底部输入框被遮住问题
<textarea type="text" value="" ref="textarea" v-model="newMsg" v-on:focus="focusIpt" v-on:blur="blurIpt" rows="1" />
data(){
return{
timer:null
}
}
methods: {
focusIpt() { // 解决输入框被激活时被键盘遮住问题
this.timer = setInterval(function() {
document.body.scrollTop = document.body.scrollHeight
}, 100)
},
blurIpt() {
clearInterval(this.timer)
}
}，
updated(){
let pannel = this.$refs.textarea;
//监听输入框，动态增加输入框高度
pannel.style.height='auto';
pannel.style.height = pannel.scrollHeight + 'px';
}

注意，滑动页面时要 clearInterval(this.timer)-------------------------------------------------------------------------------------------------------------------------------
最初的做法，用div代替textarea，既没有v-on:focus,也没有v-on:blur，不推荐用div代替textarea,上面已经完美解决input框被挡住问题，也解决textarea自适应高度问题
参考很多资料，目前测试有效，不完全好用，但是解决遮挡问题的方法<div class="div-textarea" v-model="newMsg" ref="textarea" tabindex="0"

contenteditable="true"></div>

methods:{
myFocus(){
let pannel = this.$refs.textarea;
// pannel.focus();
console.log("focus")
setTimeout(function(){
pannel.scrollIntoView(true);
pannel.scrollIntoViewIfNeeded();
document.body.scrollTop = document.body.scrollHeight;
},100);
// setInterval( () => {
// document.body.scrollTop = document.body.scrollHeight;
// },300)
}
},
updated(){
this.myFocus()
}参考 http://blog.csdn.net/u010884123/article/details/77143228