小程序兼容iphoneX（齐刘海）代码，mpvue的写法

好像写了这个代码就兼容iphoneX以上，这段代码只写了底部，顶部其实也一样

1.main.js
在该文件定义一个全局的globalData

Vue.prototype.globalData = getApp().globalData
wx.getSystemInfo({
  success: res => {
    // console.log('手机信息res'+res.model)
    let modelmes = res.model;
    if (modelmes.search("iPhone X") != -1) {
      app.globalData.isIphoneX = true;
    }
  }
});

然后在需要适配的页面

2.index.vue

  <div class="tab-footer" :class="{'isIphoneX-class': isIphoneX}"></div>

3.index.js

data() {
    return {
        isIphoneX: this.globalData.isIphoneX, //适配iphonex
    }
}

4.index.css

.isIphoneX-class {
  padding-bottom: 64rpx;
}