Перенаправление Vue обратно на ‘/’, если 404 не найдено

#vue.js #vue-router

#vue.js #vue-маршрутизатор

Вопрос:

У меня есть приложение Vue со следующими маршрутами:

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

Я знаю, что если я создам новый путь с path: '*' помощью и component: someErrorPage , я могу показать страницу с ошибкой. Тем не менее, я хотел бы перенаправить обратно на путь ввода, чтобы они могли повторить попытку.

Редактировать:

Проведя некоторые исследования и просмотрев мое приложение, я обнаружил, что если я выполняю поиск по неверному запросу, он все равно приведет меня к соответствующему маршруту, но не покажет мне данные. Пример: если я ищу действительный город (например. Нью-Йорк), я перенаправлен на localhost:8080/result/New York с правильными данными. Однако, если я выполню действительный запрос in (например, a; fldkalf), я буду перенаправлен localhost:8080/result/a;fldkalf без каких-либо данных. Это означает, что path: '*' это мне здесь не поможет.

РЕДАКТИРОВАТЬ 2: я думаю, что, возможно, я нашел что-то, что поможет, но я не уверен, как это выполнить. В Vue есть что-то, что называется защитой навигации (https://router.vuejs.org/guide/advanced/navigation-guards.html#global-before-guards ). Если бы кто-нибудь мог помочь мне разобраться в этом, это было бы здорово.

Ответ №1:

Вы можете добавить перенаправление для * (не найденного) маршрута:

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