[Vue.js] vue.jsでアンカーリンクを作成する

やりたいこと

vue.jsでアンカーリンク（ページ内リンク）の実現

手順

[その1] vue-smooth-scrollのインストール

cd *** // プロジェクトのディレクトリに移動 
npm i -D vue-smooth-scroll

[その2] main.jsファイルにプラグインの使用を宣言

import vueSmoothScroll from 'vue-smooth-scroll'
Vue.use(vueSmoothScroll);

[その3] 挿入

<a href="#section1" v-smooth-scroll="{ duration: 1000, offset: -50 }">セクション1</a>

<div id="section1">
  <!-- セクション1のコンテンツ -->
</div>