小程序scrollview滚动到指定位置的实现方法

一、设置scroll-top属性实现滚动

在小程序中，我们可以通过设置scroll-view组件的scroll-top属性来实现滚动到指定位置，具体实现方式如下：

<scroll-view scroll-top="{{scrollTop}}" style="height: 200px;">
  <view style="height: 1000px; background-color: #CCCCCC;"></view>
</scroll-view>

其中，scroll-top是一个动态数据，代表scroll-view应该滚动到的位置值，style中设置scroll-view的高度。在页面的js中，我们需要手动改变scroll-top的值来实现滚动，示例代码如下：

Page({
  data: {
    scrollTop: 0
  },
  scrollToLower: function () {
    this.setData({
      scrollTop: 500
    })
  }
})

其中，scrollToLower函数是scroll-view组件的一个事件函数，当滑动到底部时会自动触发。在函数中，我们通过setData函数设置scrollTop的值为500，这样即可实现滚动到指定位置。

二、使用scroll-into-view属性实现滚动

除了使用scroll-top属性外，我们还可以使用scroll-into-view属性来实现滚动，scroll-into-view属性用于指定某个子组件（view）的id值，当该子组件进入可视区域时，scroll-view会自动滚动到该子组件的位置。示例代码如下：

<scroll-view scroll-into-view="{{toView}}" style="height: 200px;">
  <view id="view1" style="height: 400px; background-color: #CCCCCC;"></view>
  <view id="view2" style="height: 400px; background-color: #FFFFFF;"></view>
</scroll-view>

在上述代码中，我们在两个子组件（view）中分别设置了不同的id值。在js中，我们可以通过setData函数改变toView的值来实现滚动到不同的子组件位置。示例代码如下：

Page({
  data: {
    toView: 'view2'
  },
  scrollToView: function () {
    this.setData({
      toView: 'view1'
    })
  }
})

在上述代码中，scrollToView函数是一个自定义的事件函数，通过setData函数将toView的值设为'view1'，这样即可实现滚动到view1组件所在的位置。

三、结合scroll-into-view和scroll-top属性实现更准确的滚动

在实际的开发中，我们可能需要在指定的位置滚动到一个具体的高度，此时我们就可以结合使用scroll-into-view和scroll-top属性来实现。具体实现方式如下：

<scroll-view scroll-into-view="{{toView}}" scroll-top="{{scrollTop}}" style="height: 200px;">
  <view id="view1" style="height: 400px; background-color: #CCCCCC;"></view>
  <view id="view2" style="height: 400px; background-color: #FFFFFF;"></view>
</scroll-view>

在上述代码中，我们在scroll-view组件中同时使用了scroll-into-view和scroll-top属性。在js中，我们通过setData函数改变toView和scrollTop的值来实现精确滚动到指定位置。示例代码如下：

Page({
  data: {
    toView: 'view2',
    scrollTop: 500
  },
  scrollToView: function () {
    this.setData({
      toView: 'view1',
      scrollTop: 1000
    })
  }
})

在上述代码中，scrollToView函数将toView的值设为'view1'，scrollTop的值设为1000，这样即可实现精确滚动到view1组件的1000px位置。