Meituan-Dianping / mpvue

基于 Vue.js 的小程序开发框架,从底层支持 Vue.js 语法和构建工具体系。
http://mpvue.com
MIT License
20.42k stars 2.07k forks source link

scroll-view 绑定scroll-top,无法监听 #917

Closed Rem486 closed 6 years ago

Rem486 commented 6 years ago

[问题简单描述]

需求:需要有一键返回顶部功能。 对小程序组件 scroll-view 绑定 :scroll-top="scrollTop" ,通过改变scrollTop的值来实现返回顶部的功能。 问题复现步骤:

  1. <scroll-view class="h100" scroll-y :scroll-top="scrollTop" scroll-with-animation="true">
  2. js部分,初始化 scrollTop:0,返回顶部方法,直接修改scrollTop的值。 goToTop () { this.scrollTop = 0 }
  3. 页面内滑动,scroll-top的值无变化,始终是0,导致修改scrollTop = 0无效(猜测)

期望的表现: 可以实现返回顶部功能。

观察到的表现: 之后通过增加了监听scroll方法,然后动态给scrollTop赋值的方法,实现了滚动到了顶部,但是抖动异常严 重,而且返回顶部的图标会偶尔消失。 <scroll-view class="h100" scroll-y @scroll="scroll" :scroll-top="scrollTop" scroll-with-animation="true"> 屏幕截图和动态 GIF 图

![复现步骤的屏幕截图和动态 GIF 图](图片的 url)

5b7adb6216aa0

Rem486 commented 6 years ago

大概是我理解错了,小程序原生写法就需要在滚动的时候手动设置 scrollTop 的值。

ExcellentJR commented 6 years ago

所以你最后实现了吗?还是没解决?