2020/11/16
NuxtJSでページ遷移時にTOPにスクロールする
NuxtJSベースのサイトで、ページ遷移時に毎回TOPにスクロールするように対応しました。
nuxt.config.js 内に router.scrollBehavior 関数を定義してもできるようなのですが、deprecatedになっていたので
以下のように対応しました。
プロジェクトのルートフォルダの中にappというフォルダを作成してその中に
router.scrollBehavior.js というファイルを以下の内容で作成します。
export default function(to, from, savedPosition) {
return { x: 0, y: 0 }
}
ただファイルを作成しておくだけで、applicationの挙動をoverwriteできるようです。
↓参考にしたサイト↓
以上です。簡単・便利でした。
関連する記事
【1行】JavascriptでCookieの全削除
たまにやるCookie全削除のJavascriptです
Nuxt2からNuxt3への移行とNextJSとNuxt3の比較について
弊社ホームページとブログサイトをNuxt2からNuxt3ベースに移行しました。
[NextJs]Google Mapでマーカーをセンターに表示するコンポーネントの作成
NextJsアプリ内で、Google Mapを表示して、中心にマーカーを配置するコンポーネントを作成しました。
[Next.js]client側のみで読み込むcomponent(SSRのエラーを回避)
組織図を描画するreactライブラリ`react-organizational-chart`をサーバー側で呼び込む際にエラーになる方法に対処しました