移动端键盘弹出底部按钮隐藏

最新推荐文章于 2022-11-30 14:32:42 发布

原创最新推荐文章于 2022-11-30 14:32:42 发布 · 246 阅读

0 ·

CC 4.0 BY-SA版权

javaScript 专栏收录该内容

17 篇文章

订阅专栏

本文介绍了一种使用Vue.js实现的屏幕尺寸监听方法，通过在data中定义变量来跟踪屏幕高度变化，并在窗口大小调整时更新这些值。利用watch属性监测屏幕高度的变化，当屏幕高度减小时隐藏特定元素，保持页面的响应式布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

data() {
        return {
            wxShow:true,  
            domHeight: document.documentElement.clientHeight,  //默认屏幕高度
            showHeight: document.documentElement.clientHeight,   //实时屏幕高度
        };
    },

mounted(){
        window.onresize = () => {
            return (() => {
                this.showHeight = document.documentElement.clientHeight;//这里需要注意一下可视区高度。
            })();
        };
    },

 watch:{
        showHeight() {
            if (this.domHeight > this.showHeight) {
                this.wxShow = false;
            } else {
                this.wxShow = true;
            }
        }
    },