wx.getSystemInfo({

      success: res => {

        //导航高度

        console.log(res)

        let menu = wx.getMenuButtonBoundingClientRect()

        console.log(menu,menu.top - res.statusBarHeight)

        let navHeight=res.statusBarHeight + menu.height + (menu.top - res.statusBarHeight) * 2

        console.log(navHeight)

        this.setData({

          navHeight

        })

      }, fail(err) {

        console.log(err);

      }

    })
注:先获取设备上的顶部菜单栏,菜单栏就是你手机显示电量的那个高度wx.getSystemInfo可以拿到,在去获取胶囊的信息wx.getMenuButtonBoundingClientRect(),拿到胶囊的高度和距离你菜单栏的距离也就是非自定义导航栏交流和导航顶部的距离,胶囊离下面导航栏的距离就等于上面的距离,加上导航栏和菜单栏的高度在写样式的时候给个菜单栏padding就可以了
ps:支付宝小程序不同于微信小程序,在获取设备信息是已经把胶囊上面距离给你了,就不需要wx.getMenuButtonBoundingClientRect()这个方法了,当然支付宝也没有这个方法