uni-app swiper 滑动时追加数据 current 会重置成0

uni-app swiper 滑动时追加数据 current 会重置成0

项目信息 详情
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 64
HBuilderX类型 正式
HBuilderX版本号 3.1.2
手机系统 Android
手机系统版本号 Android 11
手机厂商 小米
手机机型 Mi10
页面类型 nvue
打包方式 云端
项目创建方式 HBuilderX

操作步骤：

swiper 滑动是追加数据 current 会重置成0
安卓端追加数据的时候current会重置成0 而ios,小程序没有这个问题

预期结果：

追加数据后 还在当前位置

实际结果：

安卓端追加数据的时候current会重置成0

bug描述：

swiper 滑动是追加数据 current 会重置成0


更多关于uni-app swiper 滑动时追加数据 current 会重置成0的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

大佬!!你解决了吗?

更多关于uni-app swiper 滑动时追加数据 current 会重置成0的实战教程也可以访问 https://www.itying.com/category-93-b0.html


后来就没弄了 不知道

这是一个已知的 Android 平台特定问题，主要由于 swiper 组件在数据更新时的渲染机制差异导致。当 swiper 的列表数据动态追加时，Android 平台会重新初始化组件状态，将 current 重置为 0。

解决方案：

  1. 在追加数据前，通过 @change 事件或 ref 获取当前 swiper 的 activeIndex
  2. 使用 $nextTick 确保数据更新后 DOM 已渲染
  3. 通过 this.$refs.swiper.setCurrent(currentIndex) 手动恢复位置

示例代码：

// 记录当前位置
let currentIndex = this.current

// 追加数据
this.list = [...this.list, ...newData]

// 恢复位置
this.$nextTick(() => {
    this.$refs.swiper.setCurrent(currentIndex)
})
回到顶部