微信小程序怎么适配iphone x的解析

昨天项目遇到背景图当iphone x中变形了。所以百度了一波查到很多方法。特记录下来，希望大家能够用到吧

我们用到小程序的api wx.getSystemInfo(OBJECT)
先了解下

发现返回的参数model是手机型号的参数，那么我们就开始写代码啦
1、首先在data中点好变量
data: {
n isIphoneX: false,
},
2、首先在onload中加上判断

 wx.getSystemInfo({
      success: function (res) {
        //console.log(res.model)
        //console.log(res.language)//zh_CN(en)
        //console.log(res.model=="iPhone X")
        if (res.model == "iPhone X") {
          console.log(1)
          _this.setData({
            isIphoneX:true
          })
        }
      }
    })

3.最后步骤
写完这一步就要在wxml中加上判断了我这里判断的是当它的手机为x的时候让他背景变为bgx.jpg

<image src="../../images/bg.jpg" class='bg' wx:if="{{!isIphoneX}}"></image>
<image src="../../images/bgx.jpg" class='bg' wx:else="{{isIphoneX}}"></image>

其它的样式也是一样的，可以绑定不同的class去给ipone x适配