」html
hash模式:在瀏覽器中符號「#」,#以及#後面的字符稱之爲hash,用window.location.hash讀取;
特色:hash雖然在URL中,但不被包括在HTTP請求中;用來指導瀏覽器動做,對服務端安全無用,hash不會重加載頁面。
hash 模式下,僅 hash 符號以前的內容會被包含在請求中,如http://www.xxx.com,所以對於後端來講,即便沒有作到對路由的全覆蓋,也不會返回 404 錯誤。前端
history模式:history採用HTML5的新特性;且提供了兩個新方法:pushState(),replaceState()能夠對瀏覽器歷史記錄棧進行修改,以及popState事件的監聽到狀態變動。
history 模式下,前端的 URL 必須和實際向後端發起請求的 URL 一致,如http://www.xxx.com/items/id。後端若是缺乏對 /items/id 的路由處理,將返回 404 錯誤。Vue-Router 官網裏如此描述:「不過這種模式要玩好,還須要後臺配置支持……因此呢,你要在服務端增長一個覆蓋全部狀況的候選資源:若是 URL 匹配不到任何靜態資源,則應該返回同一個 index.html 頁面,這個頁面就是你 app 依賴的頁面。vue
首頁能夠控制導航跳轉,beforeEach,afterEach等,通常用於頁面title的修改。一些須要登陸才能調整頁面的重定向功能。vue-router
beforeEach主要有3個參數to,from,next:vuex
to:route即將進入的目標路由對象,後端
from:route當前導航正要離開的路由瀏覽器
next:function必定要調用該方法resolve這個鉤子。執行效果依賴next方法的調用參數。能夠控制網頁的跳轉。緩存