微信小程序不同机型底部安全区域问题

在微信小程序开发过程中，有些页面底部按钮是固定在底部的，还有如果是自定义tabbar也是需要固定在底部的，这里有两个问题：

• 不同机型的底部安全区域不同，如有些苹果手机底部有操作栏，这部分距离需要留出来否则会遮挡内容
• 如果底部有固定定位元素，可能会导致内容区域底部部分元素被固定元素遮挡

问题1解决方法

使用safe-area-inset-bottom CSS 属性

这个属性可以获取到底部安全区域的高度。你可以通过在需要适配的元素上使用此属性，并将其设置为对应的值来实现适配。

.bottom-wrap {
   
   
	position: fixed;
	bottom: 0;
	padding-bottom: constant(safe-area