vue3踩坑記錄(一) vue-router4的404路由匹配規則


{
    path: '*',
    name: 'error',
    component: Error,
    meta: { title: '404' },
}

區別於上面舊版的匹配規則,新版vue-router4需要使用自定義的路徑參數正則表達式,在路徑參數后面的括號中加入正則表達式;

const routes = [
  // 將匹配所有內容並將其放在 `$route.params.pathMatch` 下
  { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
  // 將匹配以 `/user-` 開頭的所有內容,並將其放在 `$route.params.afterUser` 下
  { path: '/user-:afterUser(.*)', component: UserGeneric },
]

即需要修改成:

{
    path: '/:pathMatch(.*)',
    name: 'error',
    component: Error,
    meta: { title: '404' },
},

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM