通過排查發現問題出如今路由的配置上面vue
代碼以下:vue-router
const router = new vueRouter({ mode:"history", routes:[ {path:'/index',component:Index,children:[ {path:'/users',component:Users}, ]}, {path:'/login',component:Login}, // {path:'*',redirect:'/index'}, ] })
在路由規則裏面使用了mode:"history",的屬性,爲了去掉vue-router自帶的 # 號,使路徑更加簡潔,瀏覽器
但同時也加上了訪問錯誤地址時的自動跳轉代碼ui
// {path:'*',redirect:'/index'},
這個時候就出現了bug
當點擊餓了嗎ui組件的導航菜單時,瀏覽器會尋找 /users 的地址,但在vue-router裏默認的地址應該是 ' / # / users ',因此瀏覽器會認爲沒有找到地址,將 / users 認爲是錯誤地址自帶跳轉到spa
/ index 的首頁面,在視覺上至關於沒有進行跳轉,實際上該頁面進行了兩次跳轉,第一次跳 / users 發現沒找到 ,第二次 跳回 ' /index ' 的默認地址code
形成了該bug的出現,該bug沒有任何報錯提示,屬於一種邏輯上的錯誤。component