vue router going to wrong view

Question

I have set up a vue router using the vue cli and have created a few components & views etc including a modules view with an ID which can be put in but it keeps loading the dashboard view instead of the module view.

no idea why or how it keeps overriding as when I remove the dashboard routing it works fine.

here is my router code and have tried moving things around with no luck.

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
        {path: '/', name: 'home', component: Home},
        {path: '/about', name: 'about', component: About},
        {path: '/login', name: 'login', component: Login},
        {path: '/module/:id', name: 'module', component: Module},
        {path: '/dashboard', name: 'dashboard', component: Dashboard, children: [
           { path: '/', component: Main},
           { path: 'modules', component: Modules},
        ]},
   ],
});

extra info

when i switched the order of the imports so dashboard was imported first and module second then it would switch the issue to only going to module view and not dashboard.

Have you tried changing { path: '/', component: Main}, to { path: '', component: Main},? — Steven Spungin
yes, I have tried removing all child routes with no effect only thing the made a difference was switching the import order which made the module route work but overwrites the dashboard route so I cant view the dashboard. — Andrew Dean
You are also using history mode. Is your server set up to handle that? Does temporally disabling history mode help? — Steven Spungin
Also, add a defailt route to help debug. ` { path: '*', component: NotFoundComponent }` — Steven Spungin
I'm using the Vue cli local host server, have tried disabling history mode with no luck and added the default route to be the home component. But it keeps loading the dashboard component and I have no idea why — Andrew Dean

Andrew Dean Andrew Dean · Accepted Answer · 2018-10-17T08:43:33

Not sure why this was happening, but after recreating the project using the Vue cli from scratch I stopped having the routing issue.

vue router going to wrong view

1 Answers