1.准备 scroll-view
滚动容器,包裹需要滚动的区域文章来源:https://www.toymoban.com/news/detail-782695.html
<!-- 自定义导航栏 -->
<CustomNavbar />
<scroll-view class="scroll-view" scroll-y>
<!-- 自定义轮播图 -->
<XtxSwiper :bannerList="bannerList" />
<!-- 首页分类 -->
<CategoryPanel :CategoryPanelList="CategoryPanelList" />
<!-- 热门推荐 -->
<HotPanel :HotPanelList="HotPanelList" />
<!-- 猜你喜欢 -->
<XtxGuess />
</scroll-view>
2.给父容器page设置高度为100%,完全撑开,开启并flex弹性盒,给滚动容器设值flex值为1
这里父容器必须要给高度,要不然顶部固定不起效文章来源地址https://www.toymoban.com/news/detail-782695.html
page {
background-color: #f7f7f7;
height: 100%;
display: flex;
flex-direction: column;
}
.scroll-view {
flex: 1;
}
到了这里,关于uni-app顶部导航条固定的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!