本文主要是介绍IPhone X 以上 ”下巴“ 的适配，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
一、需求
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 = 0const needSafeAreaMap = ['iPhone X','iPhone 11','iPhone 12','iPhone 13']wx.getSystemInfo({success: res => {console.log('61', res)this.statusBatHeight = res.statusBarHeightfor (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 | 设备型号 |
三、欢迎交流指正
这篇关于IPhone X 以上 ”下巴“ 的适配的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
