微信小程序局部刷新触发整页刷新效果的实现代码

网络编程 2025/1/8 佚名

3 2 1

圆月山庄资源网 Design By www.vgjia.com

效果图

如上图所示，头部的选项栏时固定的（fixed），下部的信息栏是滚动的, 由于头部是fixed所以无法实现下拉刷新的效果，如果去掉fixed当我们上拉的时候，选项栏又无法固定，所以我们需要监听页面下拉的状态随时改变选项栏的状态

1获取滚动状态

 onPageScroll(e) {
  this.scrollTop = e.scrollTop
 },

2信息栏监听下拉状态的改变而改变自己的状态

:class="scrollTop>0"

 .head-title-absolute{
  top: 0;position: absolute;
 }
 .head-title-fixed{
  top: 0;position: fixed;
 }

总结

以上所述是小编给大家介绍的微信小程序局部刷新触发整页刷新效果的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

标签：

圆月山庄资源网 Design By www.vgjia.com

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

圆月山庄资源网 Design By www.vgjia.com

评论“微信小程序局部刷新触发整页刷新效果的实现代码”

暂无评论...

www.vgjia.com 圆月山庄资源网

139,976互联网资源

144,792高清电影

21,817无损音乐

631,128技术资源

2025年01月08日