1.準(zhǔn)備 scroll-view
滾動容器,包裹需要滾動的區(qū)域文章來源:http://www.zghlxwxcb.cn/news/detail-782695.html
<!-- 自定義導(dǎo)航欄 -->
<CustomNavbar />
<scroll-view class="scroll-view" scroll-y>
<!-- 自定義輪播圖 -->
<XtxSwiper :bannerList="bannerList" />
<!-- 首頁分類 -->
<CategoryPanel :CategoryPanelList="CategoryPanelList" />
<!-- 熱門推薦 -->
<HotPanel :HotPanelList="HotPanelList" />
<!-- 猜你喜歡 -->
<XtxGuess />
</scroll-view>
2.給父容器page設(shè)置高度為100%,完全撐開,開啟并flex彈性盒,給滾動容器設(shè)值flex值為1
這里父容器必須要給高度,要不然頂部固定不起效文章來源地址http://www.zghlxwxcb.cn/news/detail-782695.html
page {
background-color: #f7f7f7;
height: 100%;
display: flex;
flex-direction: column;
}
.scroll-view {
flex: 1;
}
到了這里,關(guān)于uni-app頂部導(dǎo)航條固定的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!