uniapp自定義導航欄頁面會跟隨滾動的問題

是我一開始布局和想法就有問題

不需要考慮去固定導航欄，而是讓整個頁面不要滾動

后面大佬說了兩句話 讓我從關注導航欄 轉移到關注頁面

於是如下

滾動的區域單獨放一個容器

<template>

　　<view>

　　　　<view class = “rangking-content”>

　　　　　　頭部及其他區域

　　　　</view>　

　　　　<view class="content-type2" :style="'height:'+ scrollH + 'px'" >
　　　　　　<scroll-view scroll-y="true" >

　　　　　　　　內容

　　　　　　</scroll-view>
　　　　</view>

　　</view>

</template>

 

 

在掛載頁面的時候去獲取屏幕及元素的高度

這時候數據已經渲染完成

mounted() {
uni.getSystemInfo({
　　success: (res)=>{ // res - 各種參數
 　　　　console.log(res)
　　　　 this.screenHeight = res.screenHeight; // 屏幕的高度 
　　　　 let info = uni.createSelectorQuery().select(".rangking-content");
　　　 　　　info.boundingClientRect((data)=>{ //data - 各種參數
　　　　　　　　　　console.log(data.height) // 元素高度
　　　　　　　　　　this.scrollH = res.screenHeight - data.height - res.statusBarHeight - 20; //滾動容器的高度
　　　　　　　　　　console.log(res.screenHeight,data.height,res.statusBarHeight)
　　 　　 }).exec()
　　　　}
　　});
},

 

記住scroll-view要設置高度  因為我這里父元素是設置了高度的 所以我在全局設置了scroll-view {height：100%}

 

 

這個時候ok啦