vue-router重定向到默认路径问题

Question

我希望在用户导航到根路径时默认为特定页面,即当使用时转到myapp.com我想将它们重定向到myapp.com/defaultpage

我目前的代码是

index.js

import Full from '../containers/Full'
import DefaultView from '../views/DefaultView'

export default new Router({
  mode: 'history',
  linkActiveClass: 'open active',
  scrollBehavior: () => ({ y: 0 }),
  routes: [
    {
      path: '/',
      redirect: '/defaultview',
      name: 'home',
      component: Full,
      children: [
        {
          path: '/defaultview',
          name: 'defaultview',
          component: DefaultView
        },
        {
          path: '*',
          component: NotFoundComponent
        }
    }
]})

因为当用户访问myapp.com时,我得到了"找不到404页面" - 即NotFoundComponent.只有当我输入myapp.com/defaultview时,我才能进入正确的页面.

有任何想法吗？

Answer 1

试试这段代码:

routes: [
    {
      path: '/',
      redirect: '/defaultview'
    },
    {
      path: '/defaultview',
      name: 'defaultview',
      component: DefaultView
    },
    {
      path: '*',
      component: NotFoundComponent
    }
]

Answer 2

使用子级时，删除父级的url前缀

ex: change "/defaultview" to defaultview remove the parent path component, so the actual code should be like this

routes: [
{
  path: '/',
  redirect: '/defaultview',
  name: 'home',
  component: Full,
  children: [
    {
      path: 'defaultview', /* changed */
      name: 'defaultview',
      component: DefaultView
    },
    {
      path: '*',
      component: NotFoundComponent
    }
  ]
}

reference Nested Routes