微信小程序:底部按钮高度自适应

使用场景

由于iphoneX等型号手机底部有home虚拟键,为了按钮不被遮挡,需要调整底部按钮高度

具体操作

app.js

获取手机信息:wx.getSystemInfo()

App({
	onLaunch: function () {
		wx.getSystemInfo({
	      success: (res) => {
	        this.globalData.height = res.statusBarHeight;
	        // 获取手机型号
	        const model = res.model;
	        const modelInclude = ["iPhone X", 'iPhone XR', "iPhone XS", "iPhone XS MAX"];
	        var flag = false;//是否X以上机型
	        for (let i = 0; i < modelInclude.length; i++) {
	          //模糊判断是否是modelInclude 中的机型,因为真机上测试显示的model机型信息比较长无法一一精确匹配
	          if (model.indexOf(modelInclude[i]) != -1) {
	            flag = true
	          }
	        }
	        if (flag) {
	          //如果是这几个机型,设置距离底部的bottom值
	          this.globalData.bottom = 25;
	        }
	      }
	    })
	},
	 globalData: {
	   userInfo: null,
	   token: '',
	   height: 0,
	   bottom:0,
	 }
})

应用

然后在对应的文件中取bottom值就可以了

已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 技术工厂 设计师:CSDN官方博客 返回首页