1.准备 scroll-view
滚动容器,包裹需要滚动的区域
<!-- 自定义导航栏 --><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
这里父容器必须要给高度,要不然顶部固定不起效
page {background-color: #f7f7f7;height: 100%;display: flex;flex-direction: column;
}
.scroll-view {flex: 1;
}