微信小程序局部刷新触发整页刷新效果的实现代码微信小程序局部刷新触发整页刷新效果的实现代码
效果图
如上图所示，头部的选项栏时固定的（fixed），下部的信息栏是滚动的, 由于头部是fixed所以无法实现下拉刷新的效果，如果
去掉fixed当我们上拉的时候，选项栏又无法固定，所以我们需要监听页面下拉的状态随时改变选项栏的状态
1获取滚动状态获取滚动状态
onPageScroll(e) {
this.scrollTop = e.scrollTop
},
2信息栏监听下拉状态的改变而改变自己的状态信息栏监听下拉状态的改变而改变自己的状态
:class="scrollTop>0?'head-title-fixed':'head-title-absolute'"
.head-title-absolute{
top: 0;position: absolute;
}
.head-title-fixed{
top: 0;position: fixed;
}
总结总结
评论0
最新资源