H5开发android手机底部按钮被顶起 Vue项目

 <div class="btm_btn_div" v-if="isShow"> </div>

 data() {

    return {

      docmHeight: window.innerHeight, //屏幕高度

      showHeight: window.innerHeight, //实时屏幕窗口高度

      isShow: true, //是否显示底部按钮  默认是显示

    };

  },

  mounted() {

    // window.onresize监听页面高度的变化

    window.onresize = () => {

      return (() => {

        this.showHeight = window.innerHeight;

      })();

    };

  },

  watch: {

    showHeight: function (newValue) {

      if (this.docmHeight > newValue) {

        this.isShow= false;//当前窗口高度小于手机屏幕高度,说明input获取焦点,隐藏底部按钮

      } else {

        this.isShow= true;//当前窗口高度等于手机屏幕高度  说明input失去焦点,显示底部按钮

      }

    },

  },

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容