vue.js / nuxt.js でsmooth scrollを実装 - Qiita

目次 ・smooth-scrollについて ・vue-scrolltoを使います ・pluginsに記載 ・ページ内リンクを作成 ・最後に smooth-scrollについて ページ内リンクを実装したときに「パッと」切り替わるのではなく、スクロールしながら特定の場所まで移動する機能です。 cssでは とやれば、ページ内リンクがsmooth scrollになりますが、対応してないブラウザやosがまだまだあるのでこれを使用するのはあまり現実的ではないですねー。 その場合、実装する場合はjsを記述したりなどの対応が必要になりますが、vueでは不要ですー。 vue-scrolltoを使います smooth-scrollを実装するにあたって、vue-scrolltoを使用しますー。 まずはインストールしましょう。

[ar0]

“import Vue from 'vue' import VueScrollTo from 'vue-scrollto' Vue.use(VueScrollTo, { duration: 700, easing: [0, 0, 0.1, 1], })”