小程序适配手机，覆盖全部屏幕

做微信小程序开发时，会出现这样的问题，不同的手机高度不一样，当把高度固定之后，在高度大于设置的固定的手机上就会出现底部空白的情况（如图一），为了解决这个问题，我们可以获取手机的高度和宽度，再将获取的高度设为背景高度。
图一
问题：小程序高度设为固定，不同手机底部会出现留白情况
解决办法：获取手机的宽高，将背景颜色的高度设为获取到的手机高度
具体代码：
index.wxml
其中style=‘height:{{scroll_height}}rpx;’ 是获取手机的高度

<view class="container" style='height:{{scroll_height}}rpx;'>
   背景颜色覆盖整个屏幕,避免底部留白
</view>

index.js

//index.js
Page({
  onLoad: function () {
    //获取屏幕的宽高，避免底部出现空白
    let windowHeight = wx.getSystemInfoSync().windowHeight // 屏幕的高度        
    let windowWidth = wx.getSystemInfoSync().windowWidth // 屏幕的宽度        
    this.setData({
      scroll_height: windowHeight * 750 / windowWidth
    })
  }
})

index.wxss

/* index.wxss */
.container{
  margin: 0px;
  padding: 0px;
  color: white;
  font-size: 35rpx;
  background: #8abcd1;
}

这样就能覆盖整个手机屏幕了，如下