vue中实时监听移动端屏幕高度(采坑后实践)


最近做微信公众号活动,需要首页往input中输入内容,点击input软键盘tabbar被顶起来,网上借鉴很多(踩了许多坑)最后自己实践出来。


<--!将手机屏幕的默认高度和实时高度获取--> data(){ docmHeight: document.documentElement.clientHeight, //默认屏幕高度 showHeight: document.documentElement.clientHeight, //实时屏幕高度 hidshow: true, //显示或者隐藏footer, } <!--把window.onresize事件挂在到mounted函数上--> mounted(){ window.onresize = () => { return (() => { window.fullHeight = document.documentElement.clientHeight; that.showHeight = window.fullHeight; })() }; } <!--在watch中监听实时高度--> watch: { showHeight (val) { let that = this; that.show2 = true; if (that.docmHeight > val){ that.hidshow = false; } else{ that.hidshow = true; } } },

  

  

  实时对比屏幕高度来显示隐藏tabbar


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM