pageScrollTo 滚动距离长时，不能滚动到指定位置

[xty1992a]

相关平台

H5

复现仓库

[email protected]:xty1992a/page-scroll-bug.git
浏览器版本: 任意版本
使用框架: React

复现步骤

1. 拉取仓库
2. pnpm dev:h5
3. 点击按钮滚动，预期应该对齐上边缘，实际需要滚动 3 次才能对齐

期望结果

一次滚动到位

实际结果

不能滚动到指定位置

环境信息

Taro CLI 3.6.2 environment info:
    System:
      OS: macOS 15.1.1
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 18.20.4 - ~/.nvm/versions/node/v18.20.4/bin/node
      Yarn: 1.22.22 - ~/.nvm/versions/node/v18.20.4/bin/yarn
      npm: 10.7.0 - ~/.nvm/versions/node/v18.20.4/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.35 => 3.6.35 
      @tarojs/components: 3.6.35 => 3.6.35 
      @tarojs/helper: 3.6.35 => 3.6.35 
      @tarojs/plugin-framework-react: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-alipay: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-h5: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-jd: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-qq: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-swan: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-tt: 3.6.35 => 3.6.35 
      @tarojs/plugin-platform-weapp: 3.6.35 => 3.6.35 
      @tarojs/react: 3.6.35 => 3.6.35 
      @tarojs/runtime: 3.6.35 => 3.6.35 
      @tarojs/service: 3.6.35 => 3.6.35 
      @tarojs/shared: 3.6.35 => 3.6.35 
      @tarojs/taro: 3.6.35 => 3.6.35 
      @tarojs/taro-h5: 3.6.35 => 3.6.35 
      @tarojs/webpack5-runner: 3.6.35 => 3.6.35 
      babel-preset-taro: 3.6.35 => 3.6.35 
      eslint-config-taro: 3.6.35 => 3.6.35 
      react: ^18.2.0 => 18.3.1 

---

补充信息

排查后发现是 taro-h5 的pageScrollTo实现有问题，代码位置packages/taro-h5/src/api/ui/scroll/index.ts

      const delta = to - from

      //  fixme  此值可能不是整数
      const frameCnt = duration / FRAME_DURATION
      const easeFunc = getTimingFunc(easeInOut, frameCnt)

      const scroll = (frame = 0) => {
        const dest = from   delta * easeFunc(frame)
        scrollFunc(dest)
        if (frame < frameCnt) {
          timer && clearTimeout(timer)
          timer = setTimeout(() => {
            scroll(frame   1)
          }, FRAME_DURATION)
        } else {
          // 修复，上面已经缓动到附近了，直接滚多一次到终点即可
          //  scrollFunc(to)
          return handle.success({}, { resolve, reject })
        }
      }
      scroll()

[xty1992a]

PS. 补充另一个 bug，与编译有关，在我们项目仓库可以稳定复现，起新仓库无法复现，因此在这里补充一下，如不符合规范也请回复一下，我另开 issues。

taro 源码：

编译后（不分平台）

可以看到，一个数组直接 concat 了一个类数组，这种调用不等价与 数组 concat 数组，见下方示例：

修复