簡單的android小程序，android 應用置頂到最前端_uniApp / 小程序實現一個view滾動到一定高度置頂顯示

最近在使用uniApp做一個模仿美團小程序的demo，其中遇到這樣一個需求，就是篩選模塊滾動到頂部就置頂顯示

查閱了uniApp的官方文檔以及微信小程序的官方文檔，發現都有一個相同的API,如下：

實現思路如下：

1.在onLoad或mounted頁面初始化的生命周期方法中獲取需要置頂的view距離頂部的高度保存到data中

onLoad() {

簡單的android小程序？// 監聽篩選組件距離頂部的距離

const query = wx.createSelectorQuery()

query.select('#boxFixed').boundingClientRect()

query.exec((res)=>{

this.topRange = res[0].top //獲取距離頂部的高度并保存

})

小程序頭部導航欄自定義？},

2.監聽頁面滾動，當滾動的距離大于上述距離頂部距離則增加一個固定在頂部的樣式

// 監聽頁面滾動距離

onPageScroll(e) {

this.scrollSize = e.scrollTop

}

uniapp返回上一頁刷新數據？computed:{

// 監聽篩選組件置頂和不置頂

openFixed(){

// 如果頁面滾動的高度大于篩選組件距離頂部的高度，那就置頂，反之不置頂

if(this.scrollSize > this.topRange){

console.log('置頂')

微信小程序怎么置頂？this.isfixed = true

}else{

console.log('不置頂')

this.isfixed = false

}

}

小程序view覆蓋上一個view。}

//當上述isFixed為true的時候需要置頂的view會增加一個樣式，使用 position = fixed 脫離文檔流

//設置top = 0 即可完成置頂

本文地址：https://blog.csdn.net/C_zhihao/article/details/107116723

希望與廣大網友互動？？

點此進行留言吧！