vue-router的mode問題

在一個頁面中分別有三個div，對應三個js文件，分別為其加入設置路由，

對應的js文件如下

但是當?shù)谌齻€路由設置如下

Vue.use(VueRouter);
const router=new VueRouter({
    mode:'history',
    routes:[
       {
           path:'/settings',
           component:Levelone,
           children:[
           {
              path:'emails',
              component:Levelthree
           },
           {
              path:'profile',
              components:{
                  default:Levelfour,
                  helper:Levelfive
              }
           }
           ]
       }
    ]
})
router.push('/settings/emails')

這時就會使前面兩個路由無法正常顯示，并且報錯

但是當將第三個路由的mode設置為hash，三個路由可以正常顯示；

請問這個mode的具體設置的區(qū)別在哪里呢，設置為history的時候為什么不能正常顯示呢？

回答

編輯回答

陌離殤

之后發(fā)現(xiàn)在多個路由的mode不同的時候，可以在mode為history的路由設置為

mode:'history',
base:__dirname,

這個時候就會將所有路由正常顯示了，但是路由是命名視圖的時候，還是不行的，還是出現(xiàn)上面的問題
從而發(fā)現(xiàn)了新的問題：
將命名視圖如上面進行設置，

const router=new VueRouter({
    mode:'history',
    base:__dirname,
    routes:[
       {
           path:'/settings',
           component:Levelone,
           children:[
           {
              path:'emails',
              component:Levelthree
           },
           {
              path:'profile',
              components:{
                  default:Levelfour,
                  helper:Levelfive
              }
           }
           ]
       }
    ]
})

當不寫語句router.push('/settings/emails')的時候，頁面其他路由正常顯示

但是這個命名視圖的路由不能顯示在頁面上，但當寫入語句router.push('/settings/emails')就會出現(xiàn)一開始的錯誤，，這是為什么呢？

2017年11月26日 19:12

編輯回答

夢若殤

我猜一下，由于第三個設置為history模式，導致頁面地址變?yōu)椴粠?的地址（雖然是三個vue實例，但是路由都是操作的同一個頁面的history api），雖然沒看出來這個net::ERR_ABORTED具體是什么錯誤，但是導致的js的加載或者前兩個的路由解析（還是按照hash解析的）發(fā)生了錯誤。