vue-scrollTo

`vue-scrollTo` 是一个 Vue.js 插件，用于平滑滚动到页面内的任何元素或顶部。 它可以用于滚动到特定的锚点，或者在用户与 UI 交互时自动触发滚动。此插件可以在 Vue.js 1.x 和 2.x 中使用。

要使用 `vue-scrollTo` 插件，首先需要安装它。可以使用 npm 或 yarn 进行安装：

npm install --save vue-scrollto
# 或
yarn add vue-scrollto

安装后，在 Vue.js 应用程序中使用插件：

import Vue from 'vue'
import VueScrollTo from 'vue-scrollto'

Vue.use(VueScrollTo)

现在，你可以在 Vue.js 组件中使用 `v-scroll-to` 指令来实现滚动效果了。例如：

<template>
  <div>
    <button v-scroll-to="'#top'">回到顶部</button>
    <div id="top">这是页面顶部</div>
    <div v-for="i in 20" :key="i">这是页面内容</div>
  </div>
</template>

在上面的代码中，当用户点击“回到顶部”按钮时，页面将平滑地滚动到 id 为“top”的元素的顶部。

你可以使用以下参数来更改滚动行为：

- `v-scroll-to` 的值可以是字符串，指定要滚动到的元素的 CSS 选择器或 DOM 元素。例如，`v-scroll-to="'#top'"` 将滚动到 ID 为“top”的元素。
- `duration`（可选）：指定滚动的持续时间（以毫秒为单位）。默认值为 500。
- `offset`（可选）：指定滚动偏移量（以像素为单位）。例如，`v-scroll-to="'#top'" offset="100"` 将滚动到 ID 为“top”的元素的顶部加上 100 像素的偏移量。
- `easing`（可选）：指定滚动的缓动函数。默认值为 'ease-out'。

更多参数和使用方法可以查看 `vue-scrollTo` 的文档：https://github.com/rigor789/vue-scrollTo