第一种:onPageScroll方法是uniapp自带的监听页面滚动的方法
onPageScroll(event){

if (event){
    const { scrollTop } = event
    this.scrolltop = scrollTop
const query = uni.createSelectorQuery().in(this)

query.selectAll('.proposal-list').boundingClientRect((res)=>{

const index = res.findIndex((rect) =>{
    this.scrollIntoViewId = rect.top < 71 && rect.top > (71 - rect.height) ? rect.id : ''

return rect.top < 71 && rect.top > (71 - rect.height)

})

this.currentTab = index
}).exec()

}

}
⚠️注意:这个body一定不能限制高度

第二种:
代码用

<scroll-view scroll-y="true" style="height: 300px;" scroll-into-view="{{toView}}" scroll-with-animation="true">
  <view id="a" style="height:100px;">A</view>
  <view id="b" style="height:100px;">B</view>
  <view id="c" style="height:100px;">C</view>
  <view id="d" style="height:100px;">D</view>
  <view id="e" style="height:100px;">E</view>
</scroll-view>
<button bindtap="scrollToA">跳转到A</button>
<button bindtap="scrollToB">跳转到B</button>
Page({
  data: {
    toView: 'a'
  },
  scrollToA: function() {
    this.setData({ toView: 'a' });
  },
  scrollToB: function() {
    this.setData({ toView: 'b' });
  }
})

史晶晶
84 声望3 粉丝

菜鸟爱学习