vue.js - 如果找不到 404，Vue 重定向回“/”

Question

我有一个具有以下路线的 Vue 应用程序：

export default new Router({
    mode: 'history',
    routes: [
        {
            path: '/',
            name: 'input',
            component: Input
        },
        {
            path: '/result/:city',
            name: 'result',
            component: Result
        }
    ]
})

我知道如果我用path: '*'and做一个新路径component: someErrorPage，我可以显示一个错误页面。但是，我想重定向回输入路径，以便他们可以重试。

编辑：

在做了一些研究并查看了我的应用程序后，我发现如果我搜索无效查询，无论如何它都会带我到相应的路线，但不会显示数据。示例：如果我搜索一个有效的城市（例如纽约），我会被重定向到localhost:8080/result/New York正确的数据。但是，如果我执行有效查询（例如 a;fldkalf），我将被带到localhost:8080/result/a;fldkalf没有任何数据的地方。这意味着这path: '*'对我没有帮助。

编辑 2：我想我可能已经找到了一些有用的东西，但我不确定如何执行它。Vue 有一个叫做导航守卫的东西（https://router.vuejs.org/guide/advanced/navigation-guards.html#global-before-guards）。如果有人可以帮助我理解它，那就太好了。

标签： vue.jsvue-router

Answer 1

*您可以为（未找到）路由添加重定向：

{
  path: '*', // make sure this is the last route in Array
  redirect: { name: 'input' },
}