当用户导航到根路径时,我希望默认为特定页面

我现在的代码是

指数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页面未找到"——即NotFound组件.只有当我输入myapp时.com/defaultview我可以进入正确的页面.

有什么 idea 吗?

推荐答案

使用子项时,请删除父项的url前缀

前任:

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

参考文献Nested Routes

Vue.js相关问答推荐

如何将计算(computed)属性动态添加到Vue组件中?

可组合数据获取示例

如何防止Nuxt3重新加载时滚动跳到网页顶部

如何在 v-for 指令切换状态下安全地制作包含附加到对象的复选框的列表(W/O 切换列表中的其他复选框)?

vuex 未知动作类型:addTodo

在 VueJS 中为 Get、Post、Patch 配置全局标头的最佳方法

vuetifyjs:仅添加使用过的图标来构建

Vue cli 3项目,图像路径中的动态src不起作用

如何使用 vue-resource 添加额外的标头来发布请求?

等待来自 WDS 的更新信号

验证子组件Vue vee-validate

如何将 v-if 与 Vue.js 中的值进行比较

如何在某些路由上隐藏全局组件(例如导航栏)?

Vuex - 何时从 http 服务器加载/初始化存储数据

Vue Cli 3 不允许我在 Webpack 中处理 SVG

动态更改我的 Vue.js SPA 主题的最佳方式?

如何将事件绑定到 Vuetify 中的树视图 node ?

'vue' 未被识别为内部或外部命令

Vuejs获取事件正在调用的元素?

无法访问手表处理程序 vuejs 中的数据变量