ant-design/ant-design-mobile

`swiperRef.swipeTo`在连续跨越loop边界时会混乱

Open

#6,261 创建于 2023年7月19日

在 GitHub 查看
 (4 评论) (1 反应) (0 负责人)TypeScript (11,238 star) (2,313 fork)batch import
bughelp wanted

描述

Version of antd-mobile

5.32.0

Operating system and its version

No response

Browser and its version

Edge114

Sandbox to reproduce

https://codesandbox.io/s/interesting-sanderson-qzhw35

What happened?

以sandbox中的例子,Swiper中有6个Item

  • 通过swipeTo(index)连续快速切换-1和0位置时表现正常; 切换到-1并等待动画结束后再切换到0就会向另一个方向滚动
  • 连续切换-1和6位置时表现与上面相反: 慢速时正常,快速切换时方向错误

Relevant log output

No response

贡献者指南

技术栈
typescriptreact
领域
frontendmobile
议题类型
bug
难度面向新贡献者的预计实现难度，1 表示很小改动，5 表示专家级工作。
3
预计时间有经验贡献者完成调查、实现、测试并准备 pull request 的粗略时间范围。
1-2 days
活动状态议题当前的可参与程度：新鲜、活跃、陈旧、阻塞或等待维护者输入。
active
清晰度议题是否清楚说明期望改动、验收标准和下一步。
clear
前置要求
Basic knowledge of React and TypeScriptUnderstanding of swiper/carousel behavior
新手友好度1-100 的估计分数，表示该议题对首次贡献者的友好程度。
65
研究方向
Investigate the Swiper component's swipeTo method in the source code, particularly how it handles loop boundaries when transitioning between indices. The sandbox provided (https://codesandbox.io/s/interesting sanderson qzhw35) reproduces the issue. Check the loop logic in files like `src/components/swiper/swiper.tsx` and `src/components/swiper/use swipe.ts`. Consider the interaction between animation timing and direction calculation when calling swipeTo consecutively.