Перенаправление vue-router на путь по умолчанию

Я хочу по умолчанию указать конкретную страницу, когда пользователь переходит к корневому пути т.е. когда используется идет на 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, могу перейти на правильную страницу.

Любые идеи?

Ответы

Ответ 1

При использовании детей удалите префикс URL родительского

"/defaultview": изменить "/defaultview" на defaultview удалить родительский компонент пути, поэтому фактический код должен быть таким

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

ссылка на вложенные маршруты

Ответ 2

Попробуйте этот код:

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

Ответ 3

Вы можете сделать это, используя 1 строку кода, т.е. добавив router.replace("myPath");. Полный код:

import Vue from "vue";
import Router from "vue-router";
import MyComponent from "./my-component";

Vue.use(Router);

const routes = [
  { path: "/myPath", name: "myPath", component: MyComponent }
];

const router = new Router({
  mode: "history", // Remove the hash from the URL, optional.
  routes
});

router.replace("myPath");

export default router;