Vue3控制滚动条默认到最下方

在Vue3中，可以通过使用`ref`和`watch`来实现控制滚动条默认到最下方。

首先，在模板中给需要滚动的元素设置`ref`，如下所示：

<template>
  <div ref="scrollContainer">
    <!-- 滚动内容 -->
  </div>
</template>

然后，在组件的`setup`函数中定义一个`scrollContainer`的`ref`对象，并使用`watch`监听其变化，将其滚动到最底部：

<script>
import { ref, watch } from 'vue'

export default {
  setup() {
    const scrollContainer = ref(null)

    watch(scrollContainer, () => {
      scrollContainer.value.scrollTop = scrollContainer.value.scrollHeight
    })

    return {
      scrollContainer
    }
  }
}
</script>

上述代码中，`scrollContainer`是一个`ref`对象，用于引用模板中的滚动容器。在`watch`函数中，监听`scrollContainer`的变化，一旦发生变化，就将其滚动到最底部。`scrollTop`属性表示滚动条的垂直偏移量，`scrollHeight`属性表示滚动容器的总高度。

这样，每当滚动内容发生变化时，滚动条就会自动滚动到最底部。