微信小程序局部刷新触发整页刷新效果的实现代码
更新时间：2018年11月21日 14:52:31 作者：白马湖小龙王
这篇文章主要介绍了微信小程序局部刷新触发整页刷新效果的实现代码,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
效果图
如上图所示，头部的选项栏时固定的（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;
}
总结
以上所述是小编给大家介绍的微信小程序局部刷新触发整页刷新效果的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
可以用来运行代码的函数，跟本网站的都差不多。2009-05-05
这篇文章主要介绍了JS ES6异步解决方案，对异步感兴趣的同学，可以参考下2021-04-04
实例演示对javascript的节点的各种操作。包括hasChildNodes()，removeChild()，appendChild()，replaceChild()，insertBefore()，cloneNode()等2012-06-06
工作小知识积累，获取图片的大小，需要的朋友可以参考下。2011-09-09
JavaScript之Map和Set_动力节点Java学院整理
这篇文章主要为大家详细介绍了JavaScript之Map和Set的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
这篇文章主要介绍了JavaScript动态添加css样式和script标签的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-07-07
在JavaScript中,变量的定义是编程的基础,而JavaScript提供了多种灵活的方式来定义变量,本文将详细盘点JavaScript中所有变量定义的方式,并结合代码示例进行说明,需要的朋友可以参考下2025-01-01
这篇文章主要给大家介绍了关于Javascript中引用类型传递的知识点，文中介绍的非常详细，需要的朋友可以参考借鉴，下面来一起看看吧。2017-03-03
本文介绍了JavaScript中六种主要的继承实现方式及其适用场景,并推荐在现代项目中优先使用ES6的class继承,每种继承方式都有其特点和适用范围,选择合适的继承方式对于编写清晰、高效的JavaScript代码至关重要,感兴趣的朋友一起看看吧2025-02-02
JavaScript使用类似break机制中断forEach循环的方法
这篇文章主要介绍了JavaScript使用类似break机制中断forEach循环的方法,需要的朋友可以参考下2018-11-11
最新评论