小程序菜单栏吸顶效果
生活随笔
收集整理的這篇文章主要介紹了
小程序菜单栏吸顶效果
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
需要用到頁面滾動監聽事件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
總結
以上是生活随笔為你收集整理的小程序菜单栏吸顶效果的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: React+webpack热更新配置
- 下一篇: React ES6组件里绑定this的三