uniapp自定义导航栏navbar


<u-navbar title="首页" :bgColor="bgColor" :titleStyle='titleStyle'>
   <view class="u-nav-slot" slot="left">
    //左边插槽
   </view>
   <view class="u-nav-slot" slot="center"> -->
     <text>首页</text>
   </view>
   <view class="u-nav-slot" slot="right">
    //右边插槽
   </view>
</u-navbar>
<view class="content" :style="{ marginTop: height + 'px' }">   <!-- 正文内容 --> </view>
自定义完导航栏需要动态判断当前导航栏高度
getSystemInfo(){
    let stateHeight = '';//任务栏高度
    //胶囊距离顶部距离//胶囊高度
    const { top , height } = wx.getMenuButtonBoundingClientRect()
    wx.getSystemInfoAsync({
      success: (result) => {
        stateHeight = result.statusBarHeight;//状态栏高度
        let sum = ''
        sum = stateHeight + height + (top - stateHeight)*2 
        this.setData({
          height:sum + 'px'
        })
      },
    })

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM