小程序底部按钮-距离适配

底部安全距离：第一种是苹果，第二种是安卓。

App.vue页面

//获取当前设备信息
          export default {
                    globalData: {btnbottom: 0},
                  
		    wx.getSystemInfo({
		      success: res => {
		        this.globalData.btnbottom = res.screenHeight - res.safeArea.bottom - 5 +'px';
		      },
		      fail(err) {
		        console.log(err);
		      }
		    })
		},
           }

页面引用

<!-- 2.本店管理员 -->
<template>
<view class="footer" :style="{paddingBottom: btnbottom}">
    <navigator class="buy_btn" url="../../pages/staff/add?value=0">
	<image src="@/static/skudetail/addhexiao.png" mode=""></image>
	<text class="buy_text">新增管理员</text>
    </navigator>
						</view>
</template>
						


<script>
     const app = getApp()
     export default {
                data() {
		 return {
			btnbottom: app.globalData.btnbottom
			};
		},
            }

<script/>

如果很多页面需要使用的时候可以封装一个footer组件