自学内容网 自学内容网

Vue3:用重定向方式,解决No match found for location with path “/“问题

一、情景说明

在初学Vue3的项目中,我们配置了路由后,页面会告警
如下图:
在这里插入图片描述
具体含义就是,没有配置"/"路径对应的路由组件

二、解决

关键配置:redirect

const router = createRouter({
  history:createWebHistory(), //路由器的工作模式(稍后讲解)
  routes:[ //一个一个的路由规则
    {
      name:'zhuye',
      path:'/home',
      component:Home
    },
    {
      name:'xinwen',
      path:'/news',
      component:News,
      children:[
        {
          name:'xiang',
          path:'detail',
          component:Detail,
          props(route){
            return route.query
          }
        }
      ]
    },
    {
      name:'guanyu',
      path:'/about',
      component:About
    },
    {
      path:'/',
      redirect:'/home'
    }
  ]
})

这样,一访问页面,就自动重定向到/home路径对应的页面


原文地址:https://blog.csdn.net/Brave_heart4pzj/article/details/136945863

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!