微信小程序scroll-view动态加载数据滚动指定位置

要在微信小程序的scroll-view中实现动态加载数据并滚动到指定位置,你可以按照以下步骤进行操作:

1. 首先,在scroll-view组件中设置一个唯一的id,例如:

<scroll-view id="myScrollView" scroll-y="true" style="height: 100vh;">
  <!-- 动态加载的数据 -->
</scroll-view>


2. 在页面的js文件中,定义一个变量来保存滚动位置,例如:

Page({
  data: {
    scrollTop: 0
  },
  // 其他代码...
})


3. 当需要加载新数据时,更新scroll-view中显示的数据,并将滚动位置设置为指定的位置,例如:

Page({
  data: {
    scrollTop: 0
  },
  onLoad: function() {
    // 加载初始数据
    // ...
  },
  loadMoreData: function() {
    // 动态加载更多数据
    // ...
    
    // 更新scroll-view中的数据
    this.setData({
      // 更新数据...
    },()=>{  // 设置滚动位置
     setTimeout(() => {
          this.setData({
            scrollTop: 600
          })
       }, 100); //这里运用了setData的第二个参数,
                //callback函数用于在setData时页面渲染后执行的函数
                //加上setTimeout来异步操作
    });
  },
  // 其他代码...
})

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值