BestHub
Sign in
Tag

Navigation Guard

0 views collected around this technical thread.

Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Mar 17, 2025 · Frontend Development

Intercepting Browser Navigation Events (Back/Forward, Refresh/Close, and Route Changes) in Vue Applications

This article explains how to prevent loss of unsaved video data by intercepting browser back/forward actions, page refresh or close events, and Vue router navigation using the History API, beforeunload listener, and navigation guards, with complete Vue code examples.

Browser InterceptionHistory APINavigation Guard
0 likes · 11 min read
Intercepting Browser Navigation Events (Back/Forward, Refresh/Close, and Route Changes) in Vue Applications
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2022 · Frontend Development

Deep Dive into Vue Router 4 Component Navigation Guards

This article explains the internal implementation of component‑level navigation guards in Vue Router 4, covering guard categories, the full navigation lifecycle, the execution mechanism, and detailed source‑code analysis with examples of extractComponentsGuards, beforeRouteUpdate, beforeRouteEnter, and beforeRouteLeave.

Component GuardJavaScriptNavigation Guard
0 likes · 12 min read
Deep Dive into Vue Router 4 Component Navigation Guards
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 11, 2022 · Frontend Development

Deep Dive into Vue Router 4 Navigation Guard Source Code

This article thoroughly explains the core mechanisms of Vue Router 4 navigation guards, covering global, per‑route, and component guards, their classification, execution flow, and the underlying source‑code implementations such as useCallbacks, guardToPromiseFn, and runGuardQueue.

JavaScriptNavigation GuardRouting
0 likes · 13 min read
Deep Dive into Vue Router 4 Navigation Guard Source Code