一、需求
ihone手机”下巴“处 按钮处理,如果由下巴,那么我们把按钮的位置上移一些。
二、解决
// calcToBottomHeight 计算后bottom所需要的值
<div class="c-button" :style="{'bottom': calcToBottomHeight + 'px'}">
<div class="c-button-item c-align-center">
<span class="c-font-16">确定</span>
</div>
</div>
// calcToBottomHeight 计算后所需要的高度
<div class="c-button" :style="{'bottom': calcToBottomHeight + 'px'}">
<div class="c-button-item c-align-center" @click="deSendInvoice">
<span class="c-font-16">确定</span>
</div>
</div>computed: {
calcToBottomHeight () {
let flat = 0
const needSafeAreaMap = [
'iPhone X',
'iPhone 11',
'iPhone 12',
'iPhone 13'
]
wx.getSystemInfo({
success: res => {
console.log('61', res)
this.statusBatHeight = res.statusBarHeight
for (let i = 0; i < needSafeAreaMap.length; i++) {
if (res.model.includes(needSafeAreaMap[i])) {
flat = 1
}
}
}
})
return flat ? this.statusBatHeight : 0
}
},
statusBarHeight | number | 状态栏的高度,单位px |
model | string | 设备型号 |
三、欢迎交流指正