vue中点击按钮滑动到页面最底部

在Vue.js中，你可以通过JavaScript操作DOM或者利用内置的Vue指令来实现点击按钮后滚动到页面底部。这里提供一种简单的方法：

1. 首先，在HTML中创建一个按钮，并给它一个`@click`事件监听器，例如：

<button @click="scrollToBottom">滚动到底部</button>

2. 然后在对应的Vue组件的methods对象中定义`scrollToBottom`方法：

export default {
  methods: {
    scrollToBottom() {
      this.$refs.scrollableElement.scrollTop = this.$refs.scrollableElement.scrollHeight; // 假设你的内容区域有一个ref名叫做scrollableElement
    }
  }
}

在这里，`$refs`是Vue中的一个特性，允许你在模板上直接引用元素并获取它的实例。你需要先在模板上为可滚动的内容区域设置一个`ref`属性，例如：

<div ref="scrollableElement" class="scroll-content">
  <!-- 页面内容 -->
</div>

3. 当点击按钮时，`scrollToBottom`方法会被调用，将滚动条移动到内容的底部。

注意：这个例子假设你的内容区域是一个可以滚动的元素，如`<div>`或者其他支持滚动的容器。如果不确定某个元素是否支持滚动，可以在`scrollToBottom`方法里添加适当的错误处理。