网站建设干货图书网站优化方案范文

最近发现一个事情搞得很烦，微信小程序的弹窗内容可以滚动的时候，要保证每一次打开都在最上面，研究了一下终于发现了怎么解决

第一步

首先得把你的弹窗里面的内容用scroll-view标签包起来，像这样

  <scroll-view style="height:592rpx" scroll-y="{{true}}" scroll-top="{{scroll}}"></scroll-view>

这里需要注意三点
1 一定要有高度，设置height
2 scroll-y=“{{true}}” 一定要设置
3 设置 scroll-top=“{{scroll}}”

第二步

填充scroll-view

 <scroll-view style="height:592rpx" scroll-y="{{true}}" scroll-top="{{scroll}}"><view class="saleUnit"><view  wx:for="{{5}}" wx:key="index" ></view></view></scroll-view>

这里需要注意的是 scroll-view 下面的元素高度不要写死，写死了没办法滑动

第三步 js设置scroll

在data中定义
data: {scroll: 0,}
在弹窗打开时设置
setTimeout(()=>{if (this.data.scroll === 0) {this.setData({scroll: 0.1,})} else {this.setData({scroll: 0,})}},300)

这里有两点注意

这里加上setTimeout也是其中的一个bug ，猜测是没有渲染好，加上setTimeout后就生效了

设置0.1也是，直接设置0时，有的情况下没办法滚动到最上面，设置0.1就解决了

happy ending

要是大家有更好的建议欢迎沟通噢~