👈
Vue Routerでブラウザバックを無効化する(Composition API)
結論
import { useRouter } from 'vue-router'
export default {
setup() {
// ルーターを使用
const router = useRouter()
// ブラウザバックを無効化
addEventListener("popstate", () => {
router.push("自分自身のパス")
})
}
}
詳細
まず、addEventListener
でpopstate
を監視し、ブラウザの戻るボタンを検知します。
そして、
router.push("自分自身のパス")
とすることで、戻るボタンを押したときに現在のページへ遷移するようになります。その結果、ブラウザバックを無効化することができます。
ちなみに、ルートに名前を付けている場合は
router.push({ name: "ルートの名前" })
でも大丈夫です。
Discussion