希望可以允许用户添加滚动效果

[Soya-xy]

scrollToBottom scrollToTop scrollToIndex scrollInToView scrollToOffset 可以允许用户 添加scroll-behavior 来允许平滑滚动

[kolarorz]

好的，安排

[kolarorz]

你好，项目commit有调整。需要重新rebase后提交一下pr。
如果不方便我直接改也可以。

[Soya-xy]

不确定是否 scrollToOffset 覆盖了 全部场景

[kolarorz]

我会回归一下所有场景。感谢反馈，我尽快完成

[kolarorz]

当目标位置超出虚拟渲染起始，该滚动效果是无效的。不过已经在尝试做一个假的动画效果，来实现视觉上的平滑滚动，不过时间可能较久

[netdolphin]

这个功能很需要哇， 我尝试使用translateY + transition的CSS动画， 偏移后再是设置偏移量为0， 效果不是很好。

[Soya-xy]

这个功能很需要哇， 我尝试使用translateY + transition的CSS动画， 偏移后再是设置偏移量为0， 效果不是很好。

目前可以通过patch 暂时修改 ，也可以 使用 vueuse useTransition 暂时实现

const isScrolling = ref(false)
const source = ref(0)
const smoothIndex = useTransition(source, {
  duration: 1000,
  transition: TransitionPresets.linear,
})

watch(smoothIndex, (newValue) => {
  if (el.value) {
    const itemSize = el.value.getItemSize(Math.floor(newValue))
    el.value.clientRefEl.scrollTop = newValue * itemSize
  }
})

function startAutoScroll() {
  const scroll = () => {
    if (!isScrolling.value) {
      isScrolling.value = true
      source.value++

      setTimeout(() => {
        isScrolling.value = false
      }, 1400)
    }
  }

  setTimeout(() => {
    scroll()
    setInterval(scroll, 3000)
  }, 500)
}

onMounted(async () => {
  await nextTick()
  if (el.value) {
    startAutoScroll()
  }
})

[netdolphin]

sorry,

这个功能很需要哇， 我尝试使用translateY + transition的CSS动画， 偏移后再是设置偏移量为0， 效果不是很好。

目前可以通过patch 暂时修改 ，也可以 使用 vueuse useTransition 暂时实现

const isScrolling = ref(false)
const source = ref(0)
const smoothIndex = useTransition(source, {
  duration: 1000,
  transition: TransitionPresets.linear,
})

watch(smoothIndex, (newValue) => {
  if (el.value) {
    const itemSize = el.value.getItemSize(Math.floor(newValue))
    el.value.clientRefEl.scrollTop = newValue * itemSize
  }
})

function startAutoScroll() {
  const scroll = () => {
    if (!isScrolling.value) {
      isScrolling.value = true
      source.value++

      setTimeout(() => {
        isScrolling.value = false
      }, 1400)
    }
  }

  setTimeout(() => {
    scroll()
    setInterval(scroll, 3000)
  }, 500)
}

onMounted(async () => {
  await nextTick()
  if (el.value) {
    startAutoScroll()
  }
})

sorry, 这个方式应该是可行的。但我个人认为值得商榷。

[netdolphin]

scrollToBottom scrollToTop scrollToIndex scrollInToView最后都可以转化为scrollToOffset

譬如scrollToOffset最后为300， 那设定一个定时器， 每次scrollToOffset 10，其实就可以实现平滑过渡。这个本质和你的解决方案是一样的。

[vue-virt-list]的目的是为了解决大量数据带来的性能问题，使用定时器少量scrollToOffset也好， useTransition也罢， 使用js来实现动画， 本质上性能又浪费了。