vue定位fixed,软键盘弹出之后顶起底部内容的问题解决办法

根据屏幕高度变化，判断手机键盘是否弹出;若弹出，则隐藏底部内容；若未弹出，则显示底部内容。
(主要是监听屏幕的高度变化)

// 页面部分
<div v-show="hideshow" id="pic" class="bg-img">
      <img src="../../../assets/login/bgImg.png">
</div>

// 初始化数据
data（）{
	return{
	defaultHeight: '0', // 默认屏幕高度
	      showHeight: 0, // 实时屏幕高度
	      hideshow: true, // 显示或者隐藏footer,
	      isResize: false // 默认屏幕高度是否已获取
	}
}
// 
watch: {
    // 监听键盘弹出后屏幕高度变化
    showHeight: function() {
      if (this.defaultHeight !== this.showHeight) {
        // 键盘弹出操作
        this.hideshow = false
      } else {
        // 键盘不弹出操作
        this.hideshow = true
      }
    }
  },
  mounted() { // 页面渲染完成后执行
    this.defaultHeight = $(window).height()
    // window.onresize监听页面高度的变化
    window.onresize = () => {
      return (() => {
        this.showHeight = document.body.clientHeight
      })()
    }
  }