首先这个tabbar的值机型不一样,高度也是不一样的,动态获取的方法如下:

调用微信提供的方法 wx.getSystemInfo() 详细信息请查看 => 微信官方API

返回的设备信息json如下:

{
	"errMsg": "getSystemInfo:ok",
	"model": "iPhone 6/7/8",
	"pixelRatio": 2,
	"windowWidth": 375,
	"windowHeight": 619,
	"system": "iOS 10.0.1",
	"language": "zh_CN",
	"version": "7.0.4",
	"screenWidth": 375,
	"screenHeight": 667,
	"SDKVersion": "2.10.3",
	"brand": "devtools",
	"fontSizeSetting": 16,
	"benchmarkLevel": 1,
	"batteryLevel": 97,
	"statusBarHeight": 20,
	"safeArea": {
		"right": 375,
		"bottom": 667,
		"left": 0,
		"top": 20,
		"width": 375,
		"height": 647
	},
	"deviceOrientation": "portrait",
	"platform": "devtools",
	"devicePixelRatio": 2
}

这里我们需要用的到参数有四个

windowHeight :窗口高度
screenHeight :屏幕高度 
statusBarHeight :设备状态栏高度 
pixelRatio :设备像素比

底部的导航栏计算公式:

const tabbarHeight = ( screenHeight - windowHeight - statusBarHeight ) * pixelRatio

测试机型结果: 

iPhone 5:          56px
iphone 6/7/8 :    56px
iPhone 6/7/8 Plus: 84px
iPhone X:          114px
 ...
更多机型,请自测,记得回来点个赞!

备注:建议在app.js中调用,然后全局设置即可

我提供一个可行的办法，用于自定义tababr的情况

height: calc(100vh - 96rpx（自定义的tabbar组件高度） - env(safe-area-inset-bottom)（适配苹果）);

可以通过wx.getSystemInfo()方法获取到 screenHeight 和 windowHeight

screenHeight - windowHeight就是 tabbar 的高度,我就是这么搞的...楼主试试

const info = wx.getSystemInfoSync();
// tabBar高度，单位px
const tabBarHeight = Math.max(
0,
info.safeArea
  ? info.safeArea.bottom - info.windowHeight
  : info.screenWidth - info.windowHeight
);

就用 flex 布局实现，让 scroller-view 占完余下的空间

<template>
  <view class="index-page-container">
    <!--其它组件 如搜索框、Tab等-->
     <view class="sku-list-view">
      <scroll-view class="scroll-container"
                   :scroll-y="true">
        <sku-contents :SKUs="SKUs"/>
      </scroll-view>
    </view>
  </view>
</template>
    
<style lang="scss">
.index-page-container {
  display: flex;
  flex-direction: column;

  .sku-list-view {
    flex: 1;
    padding-left: 33rpx;
    padding-right: 33rpx;

    .scroll-container {
      height: 100%;
    }
  }
}
</style>

底部的导航栏计算公式:

const tabbarHeight = ( screenHeight - windowHeight - statusBarHeight ) * pixelRatio

不建议使用这个，这个算出来的是导航栏的高度

建议通过添加id （ id="tabbar"）直接获取高度：

    wx.createSelectorQuery().select("#tabbar").fields({size: true},function(res){

      console.log(res)

    }).exec()

如果是自定义的tabbar呢 该如何获取

flex-grow