关于锚点滚动的实现方法

Question

老师好，关于3-10节中的滚动的实现方式，我想通过获取当前 move 到的那个元素，然后获取那个元素的 data-index 属性，然后调用 scrollTo 方法来实现歌手列表定位。
而不是通过计算偏移量来计算 anchorIndex 的值。请问这样做会有什么问题或缺点吗？谢谢~

代码如下：

    function onShortcutTouchStart(e) {
        const anchorIndex = parseInt(e.target.dataset.index)

        scrollTo(anchorIndex)
    }

    function onShortcutTouchMove(e) {
        const touch = e.touches[0]
        const pageX = touch.pageX
        const pageY = touch.pageY
        const currentElement = document.elementFromPoint(pageX, pageY)
        const index = parseInt(currentElement.dataset.index)

        scrollTo(index)
    }

Answer 1

ustbhuangyi 2021-05-07 14:51:12

如果你移出去呢（手指落在列表之外）

• 提问者 慕神5500151 #1

  那种情况下 index 是 NaN，然后 scrollTo 和老师写的一样，就会直接 return。

• 提问者 慕神5500151 #2

  你的意思是如果我的手指从左侧移出锚点的话，继续上下滚动就没法获取 index，导致不能歌手列表不能继续滚动了吗？（我自己的代码已经还原了看不到效果）

• ustbhuangyi 回复 提问者 慕神5500151 #3

  对啊，课程的做法在移动过程中可以在外面移动，且不影响滚动。

点开查看后面1条评论