Vue の VueRouter を使って、前のページに戻るボタンを実装する方法についてまとめました

VueRouter で前のページに戻るボタンを設置します

正解の例

<a @click="$router.back()">戻る</a>

ダメだった例

<router-link :to="$router.back">戻る</route-link>

下のボタンだとページが読み込まれると戻るが発動して、勝手に戻っちゃうので、

正解の例でいいんじゃないでしょーか。

それでは。

この機能は、ブラウザの戻ると同じ挙動になります

もし、パンくずリストのように、1 個階層を戻したい時の場合であれば、しっかり

<router-link :to="{ name: 'ikkomaeno-name'}">戻る</router-link>

このように、ルーティング先を指定した方が良いと思います。

それでは！

新しめの記事たち

Nuxt.js でデプロイ時のデータが常に表示されて更新が反映されない時の対処法

⇨Vue の Computed 算出プロパティを使う方法