vue+vux 移动端键盘弹起导致UI上移问题
使用vux的x-input组件开发时,在部分iphone和android机上,遇到了系统键盘弹起时,导致UI上移现象,最终解决,给input框绑定“失焦”事件,设置页面scrollTop为0即可,x-input中是 @on-blur<x-input@on-blur="onBlur"/>// methods中onBlur() {let scrollTop = document.docum
·
使用vux的x-input组件开发时,在部分iphone和android机上,遇到了系统键盘弹起时,导致UI上移现象,最终解决,给input框绑定“失焦”事件,设置页面scrollTop为0即可,x-input中是 @on-blur
<x-input @on-blur="onBlur"/>
// methods中
onBlur() {
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if( scrollTop > 0 ) {
document.documentElement.scrollTop = 0
document.body.scrollTop = 0;
}
}
如果不写动画效果的话,其实效果会很僵硬,直接回到底部,小伙伴们可以加个过渡,让回到顶部比较自然就完美啦!!
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)