vue-router 4 '/:pathMatch(.*)*' 不工作？

Question

大家好，我想问一下 vue-router。 当我使用 vue 2 如果页面不匹配时，我使用 path: '*' 转到我的 page404 但在 vue 3 中它已被替换为 '/:pathMatch (.)' 在我尝试之后，控制台中的警告消失了，但我只是得到一个空白页面，它没有指向我的 page404。我错过了什么？我是 vue 3 的新手

这是我正在使用的版本：

1. vue: ^3.0.0
2. vue-router: ^4.0.0-0

这是我的 index.js

import { createRouter, createWebHistory, RouterView } from 'vue-router'

const routes = [
   {
      path: '/',
      redirect: '/login',
      component: RouterView,
      children: [{
        path: '/login',
        component: () => import('@/views/login/Login.vue'),
      }]
   },
   {
      path: '/:pathMatch(.*)*',
      component: () => import('@/views/page404/Page404.vue')
   }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

Answer 1

你可以试试这样写

{
    path: "/:pathMatch(.*)*",
    redirect: "/404"
},
{
    path: "/404",
    name: "404",
    component: () => import("@/views/page404/Page404.vue")
}