第一步、在data中定义参数
data() {
return {
defaultPhoneHeight: '', //屏幕默认高度
nowPhoneHeight: '', //屏幕现在的高度
footer: true,
}
},
第二步、在【mounted】【watch】做以下操作,从而进行软键盘唤起和关闭的操作
mounted() {
//监听软键盘获取当前屏幕高度的事件
this.defaultPhoneHeight = window.innerHeight
window.onresize = () => {
this.nowPhoneHeight = window.innerHeight
}
},
watch:{
//软键盘弹起事件
nowPhoneHeight(){
if(this.defaultPhoneHeight != this.nowPhoneHeight){ //手机键盘被唤起
this.footer = false
}else{ //手机键盘被关闭
this.footer = true
}
}
},
第三步、添加判断
<!-- 底部 -->
<view class="fixed_low bg-fff" v-if="footer">
<view>底部按钮</view>
</view>