在 vue 應用中,使用 hash 模式時,當 URL 中的 hash 值發生變化時,Vue 會自動響應這一變化并更新視圖,這得益于瀏覽器中的window.onhashchange()
方法。
然而,有些老舊的瀏覽器(比如 Internet Explorer)不支持此方法,因此在使用 Vue 開發應用時需要特別注意這一問題。對于這些不支持onhashchange()
方法的瀏覽器,需要手動監聽window.location.hash
屬性的變化,以及通過 Vue Router 提供的router.replace()
方法手動更新路由。
// 手動監聽 hash 變化
window.setInterval(function () {
if (window.location.hash !== router.currentRoute.hash) {
router.replace(window.location.hash.slice(1))
}
}, 50)
除此之外,Vue 還提供了一個名為VueRouter.mode
的配置項,用于指定路由的模式。默認情況下,VueRouter 的模式為hash
,但我們也可以將其設置為history
,以使用 HTML5 History API 來實現前端路由。然而,需要特別注意的是,對于不支持 History API 的瀏覽器依然需要手動處理路由。
下一篇c 正則解析json