需要用到页面滚动监听事件onPageScroll (e) { }
//index.wxml<view class='{{typeFixed?"typefixed":""}}'></view>
//index.wxss.typefixed{position: fixed;top:100rpx;left:0;z-index: 3;}
//index.jsdata:{typeFixed:false},onPageScroll:function(e){//当滚动位置大于190px并且typeFixed为true时,setData不再执行,可有效避免页面的卡顿,以及吸顶时页面的抖动if (e.scrollTop >= 190 && !this.data.typeFixed){this.setData({typeFixed: true})console.log(11111)} else if (e.scrollTop < 190 && this.data.typeFixed){this.setData({typeFixed:false})console.log(22222)}}
setData 是小程序开发中使用最频繁的接口,也是最容易引发性能问题的接口。因此尽量减少setData
如果觉得《小程序菜单栏吸顶效果》对你有帮助,请点赞、收藏,并留下你的观点哦!