vue cliのscroll behavior: アンカーリンクをつくる方法 - Qiita

こんにちは。備忘録です。 ページ内にたくさんの記事があるとします。1ページに表示されている記事数は5つ。ところが一番下にある「もっと読む」というボタンをクリックすると、新たに5記事が表示される。そんな動きをしたいとします。 ところがアンカーリンクを設定しなければ、「もっと読む」をクリックしたときにページのトップに連れて行かれてしまいます。UX的には、「もっと読む」をクリックしたときは、トップに飛ばされないまま、続く5つの記事が見たいです。 こんなとき、vue.jsではscroll behaviorという機能を使って、トップに連れて行かれないよう調整することができます。 （下に来る例が上にくる例と違うので紛らわしいのですが、、、） Step 1. RouterのJSファイルをいじる。 const router = new Router({ mode: "history", scrollBeh