uniapp 将元素滚动到指定位置的两种方法

1）使用 uni.pageScrollTo 方法，属于页面级别滚动。

2）使用 scroll-view 标签的属性：scroll-top(距离值 num) 或 scroll-into-view(子元素的id,不能以数字开头 string); 属于区域级别滚动。

两种方式的前提是：提供具体的高度值

uni.pageScrollTo 方法，将页面滚动到目标位置。

uni.pageScrollTo({
   scrollTop: 0,
   duration: 0,
})

如果传入 scrollTop 不起效，应该是布局的问题，它是页面级的滚动：所有的滚动单元必须是在根元素下，由滚动单元直接撑起来的高度，就可以滚动到指定位置。

 //获取元素离页面顶部的距离
    getElementScollTop() {
      const query = uni.createSelectorQuery()
      query
        .select('.index-con')
        .boundingClientRect((data) => {
          console.log(data, 'data')
          let pageScrollTop = Math.round(data.top)
          uni.pageScrollTo({
            scrollTop: pageScrollTop, //滚动的距离
            duration: 0, //过渡时间
        })
      })
        .exec()
    },

scroll-view 标签方法

上一篇：微信小程序怎么封装方法并全局调用

uniapp 将元素滚动到指定位置的两种方法

推荐标签

下载该资源用户也下载了

签到成功!