vue3+typescript前端项目 手机端 点击按钮 滚动到底部

你可以使用Vue.js提供的`ref`和`$refs`来获取到页面中要滚动的元素，然后通过`scrollTo()`方法将滚动条滚动到底部。

下面是一个示例代码：

<template>
  <div ref="scrollContainer" style="height: 100%; overflow: auto;">
    <!-- 这里是要滚动的内容 -->
    <!-- ... -->
    <button @click="scrollToBottom">滚动到底部</button>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  methods: {
    scrollToBottom() {
      const container = this.$refs.scrollContainer as HTMLElement;
      container.scrollTo({
        top: container.scrollHeight,
        behavior: 'smooth',
      });
    },
  },
});
</script>

在上面的代码中，我们使用`ref`来获取到`div`元素，然后在方法中将滚动条滚动到底部。注意，我们需要将`ref`的类型断言为`HTMLElement`，这样才可以调用`scrollTo()`方法。

希望这个示例可以帮助到你！